diff --git a/docs/api/config/js_kanban_cardheight_config.md b/docs/api/config/js_kanban_cardheight_config.md index ecf4ce0..5f58543 100644 --- a/docs/api/config/js_kanban_cardheight_config.md +++ b/docs/api/config/js_kanban_cardheight_config.md @@ -20,7 +20,7 @@ cardHeight?: number; // px If you combine the [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) and [`scrollType: "default"`](api/config/js_kanban_scrolltype_config.md) settings, don't forget to specify a static height for cards via the `cardHeight` property. Unless you specify it, the cards will not be displayed. When you use [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) with [`scrollType: "column"`](api/config/js_kanban_scrolltype_config.md), you should also fix the height of cards via the `cardHeight` property. Although a variable height of cards is supported for this type of layout, it may not work in a stable manner with custom card content. -If `cardHeight` is not specified, the widget falls back to an experimental approximation of card heights based on the visible fields declared in [`cardShape`](api/config/js_kanban_cardshape_config.md). With a custom [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md), this approximation does not apply — in that case, either set `cardHeight` explicitly or supply a custom [`getCardHeight`](api/config/js_kanban_getcardheight_config.md) function. +If `cardHeight` is not specified, the widget falls back to an experimental approximation of card heights based on the visible fields declared in [`cardShape`](api/config/js_kanban_cardshape_config.md). With a custom [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md), this approximation does not apply. In that case, either set `cardHeight` explicitly or supply a custom [`getCardHeight`](api/config/js_kanban_getcardheight_config.md) function. ::: ### Example diff --git a/docs/api/config/js_kanban_getcardheight_config.md b/docs/api/config/js_kanban_getcardheight_config.md index bebdb5b..cf08717 100644 --- a/docs/api/config/js_kanban_getcardheight_config.md +++ b/docs/api/config/js_kanban_getcardheight_config.md @@ -30,7 +30,7 @@ The callback function takes the following arguments: - `card` - the data object of the card - `cardWidth` - the current width of the card in pixels -The function must return a number — the estimated height of the card in pixels. +The function must return the estimated height of the card in pixels. ### Default config diff --git a/docs/api/provider/rest_methods/js_kanban_getidresolver_method.md b/docs/api/provider/rest_methods/js_kanban_getidresolver_method.md index a79d1e0..7d03fc5 100644 --- a/docs/api/provider/rest_methods/js_kanban_getidresolver_method.md +++ b/docs/api/provider/rest_methods/js_kanban_getidresolver_method.md @@ -24,13 +24,13 @@ getIDResolver(): (id: string | number, type: number) => string | number; The method returns an `idResolver(id, type)` function: -- `id` — the entity ID to resolve (a temporary client-side ID or a regular ID) -- `type` — the model type the ID belongs to: - - `1` — card (`CardID`) - - `2` — row (`RowID`) - - `3` — column (`ColumnID`) - - `4` — link (`LinkID`) - - `5` — comment (`CommentID`) +- `id` - the entity ID to resolve (a temporary client-side ID or a regular ID) +- `type` - the model type the ID belongs to: + - `1` - card (`CardID`) + - `2` - row (`RowID`) + - `3` - column (`ColumnID`) + - `4` - link (`LinkID`) + - `5` - comment (`CommentID`) When the client creates a new entity (card, column, row, link, comment), `RestDataProvider` assigns it a temporary client-side ID and remembers the backend ID returned by the server. The `idResolver(id, type)` function returns the backend ID for any temporary ID it still holds. For IDs that already match the backend, the function returns them unchanged. diff --git a/docs/guides/configuration.md b/docs/guides/configuration.md index 2aa58c6..b5e7ce1 100644 --- a/docs/guides/configuration.md +++ b/docs/guides/configuration.md @@ -8,38 +8,38 @@ description: Read the DHTMLX Kanban configuration guide. Learn how to set up car You can configure the Kanban appearance and functionality with the following properties: -- [`cardShape`](api/config/js_kanban_cardshape_config.md) — set up card appearance and built-in fields -- [`editorShape`](api/config/js_kanban_editorshape_config.md) — define editor fields -- [`editor`](api/config/js_kanban_editor_config.md) — control editor visibility, autosave, and placement -- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) — adjust card rendering and board scrolling -- [`history`](api/config/js_kanban_history_config.md) — manage history of card operations -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — customize card appearance (see the [Customization](guides/customization.md) section) -- [`locale`](api/config/js_kanban_locale_config.md) — apply a locale (see the [Localization](guides/localization.md) section) -- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) — load data for cards, columns, rows, and links (see the [Working with data](guides/working_with_data.md) section) +- [`cardShape`](api/config/js_kanban_cardshape_config.md) - set up card appearance and built-in fields +- [`editorShape`](api/config/js_kanban_editorshape_config.md) - define editor fields +- [`editor`](api/config/js_kanban_editor_config.md) - control editor visibility, autosave, and placement +- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) - adjust card rendering and board scrolling +- [`history`](api/config/js_kanban_history_config.md) - manage history of card operations +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - customize card appearance (see the [Customization](guides/customization.md) section) +- [`locale`](api/config/js_kanban_locale_config.md) - apply a locale (see the [Localization](guides/localization.md) section) +- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) - load data for cards, columns, rows, and links (see the [Working with data](guides/working_with_data.md) section) ## Cards The Kanban board consists of cards distributed into columns and rows. Use the [`cardShape`](api/config/js_kanban_cardshape_config.md) property to configure card appearance and built-in fields: -- `label: boolean | { show }` — card label, edited with the [`text`](#text-and-textarea-types) type -- `description: boolean | { show }` — card description, edited with the [`textarea`](#text-and-textarea-types) type -- `progress: boolean | { show }` — card progress, edited with the [`progress`](#progress-type) type -- `start_date: boolean | { show, format }` — card start date, edited with the [`date`](#date-and-daterange-types) type -- `end_date: boolean | { show, format }` — card end date, edited with the [`date`](#date-and-daterange-types) type -- `menu: boolean | { show, items }` — card context menu -- `attached: boolean | { show }` — card attachment, edited with the [`files`](#files-type) type -- `color: boolean | { show, values }` — top color line of the card, edited with the [`color`](#color-type) type -- `cover: boolean | { show }` — card preview image -- `comments: boolean | { show }` — card comments -- `confirmDeletion: boolean | { show }` — confirmation dialog for card deletion -- `votes: boolean | { show, clickable }` — card votes -- `users: boolean | { show, values, maxCount }` — users assigned to the card, edited with the [`combo`, `select`, or `multiselect`](#combo-select-and-multiselect-types) types -- `priority: boolean | { show, values }` — card priority, edited with the [`combo` or `select`](#combo-select-and-multiselect-types) type -- `css: (card) => string` — function that returns a CSS class applied to a card conditionally -- `headerFields: [{ key, label, css }]` — custom card fields +- `label: boolean | { show }` - card label, edited with the [`text`](#text-and-textarea-types) type +- `description: boolean | { show }` - card description, edited with the [`textarea`](#text-and-textarea-types) type +- `progress: boolean | { show }` - card progress, edited with the [`progress`](#progress-type) type +- `start_date: boolean | { show, format }` - card start date, edited with the [`date`](#date-and-daterange-types) type +- `end_date: boolean | { show, format }` - card end date, edited with the [`date`](#date-and-daterange-types) type +- `menu: boolean | { show, items }` - card context menu +- `attached: boolean | { show }` - card attachment, edited with the [`files`](#files-type) type +- `color: boolean | { show, values }` - top color line of the card, edited with the [`color`](#color-type) type +- `cover: boolean | { show }` - card preview image +- `comments: boolean | { show }` - card comments +- `confirmDeletion: boolean | { show }` - confirmation dialog for card deletion +- `votes: boolean | { show, clickable }` - card votes +- `users: boolean | { show, values, maxCount }` - users assigned to the card, edited with the [`combo`, `select`, or `multiselect`](#combo-select-and-multiselect-types) types +- `priority: boolean | { show, values }` - card priority, edited with the [`combo` or `select`](#combo-select-and-multiselect-types) type +- `css: (card) => string` - function that returns a CSS class applied to a card conditionally +- `headerFields: [{ key, label, css }]` - custom card fields :::tip -When you activate a field in `cardShape`, the editor displays the matching control automatically. Configure each control through the [`editorShape`](api/config/js_kanban_editorshape_config.md) property — see [Editor](#editor) for the available types. +When you activate a field in `cardShape`, the editor displays the matching control automatically. Configure each control through the [`editorShape`](api/config/js_kanban_editorshape_config.md) property. See [Editor](#editor) for the available types. ::: The following code snippet configures cards with custom users, priorities, and a custom header field: @@ -98,14 +98,14 @@ If you do not specify card settings through the [`cardShape`](api/config/js_kanb The Kanban editor contains fields for managing card data. Use the [`editorShape`](api/config/js_kanban_editorshape_config.md) property to configure editor fields. The following field types are available: -- [`combo`, `select`, `multiselect`](#combo-select-and-multiselect-types) — dropdown options -- [`color`](#color-type) — color picker -- [`text`, `textarea`](#text-and-textarea-types) — text inputs -- [`progress`](#progress-type) — progress slider -- [`files`](#files-type) — file uploader -- [`date`, `dateRange`](#date-and-daterange-types) — single date or date range -- [`comments`](#comments-type) — card comments -- [`links`](#links-type) — card links +- [`combo`, `select`, `multiselect`](#combo-select-and-multiselect-types) - dropdown options +- [`color`](#color-type) - color picker +- [`text`, `textarea`](#text-and-textarea-types) - text inputs +- [`progress`](#progress-type) - progress slider +- [`files`](#files-type) - file uploader +- [`date`, `dateRange`](#date-and-daterange-types) - single date or date range +- [`comments`](#comments-type) - card comments +- [`links`](#links-type) - card links :::info Display the editor as a sidebar or modal window with the [`editor.placement`](api/config/js_kanban_editor_config.md) property. @@ -444,10 +444,10 @@ If you do not specify editor settings through the [`editorShape`](api/config/js_ The [`editor`](api/config/js_kanban_editor_config.md) property controls editor visibility, autosave, and placement: -- [`editor.show`](api/config/js_kanban_editor_config.md) — enable or disable the editor -- [`editor.placement`](api/config/js_kanban_editor_config.md) — display the editor as a `"sidebar"` or `"modal"` window -- [`editor.autoSave`](api/config/js_kanban_editor_config.md) — enable or disable autosave mode -- [`editor.debounce`](api/config/js_kanban_editor_config.md) — delay before autosaving (applies only with `autoSave: true`) +- [`editor.show`](api/config/js_kanban_editor_config.md) - enable or disable the editor +- [`editor.placement`](api/config/js_kanban_editor_config.md) - display the editor as a `"sidebar"` or `"modal"` window +- [`editor.autoSave`](api/config/js_kanban_editor_config.md) - enable or disable autosave mode +- [`editor.debounce`](api/config/js_kanban_editor_config.md) - delay before autosaving (applies only with `autoSave: true`) The following code snippet enables autosave with a 2-second delay: @@ -469,8 +469,8 @@ new kanban.Kanban("#root", { The Kanban widget renders all cards and scrolls the entire board by default. For boards with many cards, switch to lazy rendering or per-column scrolling: -- [`renderType`](api/config/js_kanban_rendertype_config.md) — set to `"lazy"` to render only the cards visible on the board -- [`scrollType`](api/config/js_kanban_scrolltype_config.md) — set to `"column"` to scroll each column independently +- [`renderType`](api/config/js_kanban_rendertype_config.md) - set to `"lazy"` to render only the cards visible on the board +- [`scrollType`](api/config/js_kanban_scrolltype_config.md) - set to `"column"` to scroll each column independently The following code snippet enables lazy rendering and per-column scrolling: @@ -488,7 +488,7 @@ new kanban.Kanban("#root", { :::important When you combine `renderType: "lazy"` with any `scrollType`, set a static height for cards through the [`cardHeight`](api/config/js_kanban_cardheight_config.md) property. Without `cardHeight`, lazy rendering does not display cards correctly. -If `cardHeight` is omitted with `renderType: "lazy"` and `scrollType: "column"`, the widget falls back to an experimental approximation of card heights based on the visible fields in [`cardShape`](api/config/js_kanban_cardshape_config.md). For boards that use a custom [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md), the widget cannot predict the rendered height — supply a custom [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md) function that returns the estimated card height. +If `cardHeight` is omitted with `renderType: "lazy"` and `scrollType: "column"`, the widget falls back to an experimental approximation of card heights based on the visible fields in [`cardShape`](api/config/js_kanban_cardshape_config.md). For boards that use a custom [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md), the widget cannot predict the rendered height. Supply a custom [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md) function that returns the estimated card height. ::: ## History of changes diff --git a/docs/guides/customization.md b/docs/guides/customization.md index 1a1ce8c..f672194 100644 --- a/docs/guides/customization.md +++ b/docs/guides/customization.md @@ -8,12 +8,12 @@ description: Use DHTMLX Kanban customization guides to modify templates, menus, You can customize the Kanban appearance and behavior with the following properties: -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — render cards with a custom HTML template -- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) — modify the context menu for cards, columns, and rows -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — replace column header templates -- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) — apply CSS classes conditionally -- [`items`](api/config/toolbar_items_config.md) — rearrange Toolbar structure and add custom controls -- CSS variables — adjust visual styles (see the [Stylization](guides/stylization.md) section) +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - render cards with a custom HTML template +- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) - modify the context menu for cards, columns, and rows +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - replace column header templates +- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) - apply CSS classes conditionally +- [`items`](api/config/toolbar_items_config.md) - rearrange Toolbar structure and add custom controls +- CSS variables - adjust visual styles (see the [Stylization](guides/stylization.md) section) ## Custom cards @@ -21,10 +21,10 @@ Use the [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) property t The callback receives an object with the following parameters: -- `cardFields` — card data -- `selected` — whether the card is selected -- `dragging` — whether the card is being dragged -- `cardShape` — card configuration +- `cardFields` - card data +- `selected` - whether the card is selected +- `dragging` - whether the card is being dragged +- `cardShape` - card configuration To embed a context menu trigger in a custom card template, wrap the menu icon in a `
` with the `data-menu-id=${cardFields.id}` attribute (the same structure as the built-in card). The widget binds the menu to the wrapper through this attribute. @@ -40,21 +40,21 @@ Configure the context menu for cards, columns, and rows through the [`cardShape. By default the card menu shows **Duplicate** and **Delete** options. Available built-in action IDs: -- `"duplicate-card"` — duplicate the card -- `"delete-card"` — delete the card +- `"duplicate-card"` - duplicate the card +- `"delete-card"` - delete the card ### `columnShape.menu` -- `"add-card"` — add a new card to the column -- `"set-edit"` — rename the column -- `"move-column:left"`, `"move-column:right"` — move the column left or right -- `"delete-column"` — delete the column +- `"add-card"` - add a new card to the column +- `"set-edit"` - rename the column +- `"move-column:left"`, `"move-column:right"` - move the column left or right +- `"delete-column"` - delete the column ### `rowShape.menu` -- `"set-edit"` — rename the row -- `"move-row:up"`, `"move-row:down"` — move the row up or down -- `"delete-row"` — delete the row +- `"set-edit"` - rename the row +- `"move-row:up"`, `"move-row:down"` - move the row up or down +- `"delete-row"` - delete the row Set `menu.items` to a function to render a different menu per card, column, or row. Return `null` or `false` from the function to hide the menu for a specific item. @@ -66,9 +66,9 @@ The following demo applies a custom context menu: The [`columnShape`](api/config/js_kanban_columnshape_config.md) property provides templates and behavior for column headers: -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) — HTML template of the column header in the expanded state -- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — HTML template of the column header in the collapsed state -- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) — freeze column headers during vertical scroll (default: `true`) +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) - HTML template of the column header in the expanded state +- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - HTML template of the column header in the collapsed state +- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) - freeze column headers during vertical scroll (default: `true`) The following code snippet sets a custom header template with a collapse icon, label with card count, and menu trigger: @@ -103,9 +103,9 @@ For `fixedHeaders` to take effect, set a fixed height on the Kanban container so To apply a CSS class conditionally, pass a function to the `css` parameter of [`cardShape`](api/config/js_kanban_cardshape_config.md), [`columnShape`](api/config/js_kanban_columnshape_config.md), or [`rowShape`](api/config/js_kanban_rowshape_config.md). The function returns a class name based on the current data: -- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) — class applied to a card -- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) — class applied to a column -- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) — class applied to a row +- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) - class applied to a card +- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) - class applied to a column +- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) - class applied to a row The following code snippet highlights overdue cards and underloaded columns: diff --git a/docs/guides/initialization.md b/docs/guides/initialization.md index 2ed382f..9a30728 100644 --- a/docs/guides/initialization.md +++ b/docs/guides/initialization.md @@ -81,8 +81,8 @@ For details on configuring the Toolbar, read the [Configuration](guides/configur For the full configuration reference: -- [Kanban properties overview](api/overview/properties_overview.md) — all Kanban configuration properties -- [Toolbar properties overview](api/overview/toolbar_properties_overview.md) — all Toolbar configuration properties +- [Kanban properties overview](api/overview/properties_overview.md) - all Kanban configuration properties +- [Toolbar properties overview](api/overview/toolbar_properties_overview.md) - all Toolbar configuration properties ## Example diff --git a/docs/guides/integration_with_svelte.md b/docs/guides/integration_with_svelte.md index e3b6af7..afaf04c 100644 --- a/docs/guides/integration_with_svelte.md +++ b/docs/guides/integration_with_svelte.md @@ -20,8 +20,8 @@ Install [Vite](https://vite.dev/) (optional) and [Node.js](https://nodejs.org/en Set up a Svelte project in one of two ways: -- with [SvelteKit](https://kit.svelte.dev/) — recommended -- with Svelte and Vite (without SvelteKit) — run: +- with [SvelteKit](https://kit.svelte.dev/) - recommended +- with Svelte and Vite (without SvelteKit) - run: ~~~json npm create vite@latest diff --git a/docs/guides/localization.md b/docs/guides/localization.md index 91fb4bf..3975cd8 100644 --- a/docs/guides/localization.md +++ b/docs/guides/localization.md @@ -144,11 +144,11 @@ const en = { A locale object contains five top-level sections: -- `lang` — language code (for example, `"en-US"`) -- `kanban` — UI labels (buttons, dialogs, search, sort options, link relations) -- `calendar` — date picker labels and settings (month and day names, clock format, week start, AM/PM markers) -- `formats` — date and time format patterns (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) -- `core` — shared dialog buttons (`ok`, `cancel`) +- `lang` - language code (for example, `"en-US"`) +- `kanban` - UI labels (buttons, dialogs, search, sort options, link relations) +- `calendar` - date picker labels and settings (month and day names, clock format, week start, AM/PM markers) +- `formats` - date and time format patterns (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) +- `core` - shared dialog buttons (`ok`, `cancel`) A locale object must include translations for every Kanban and Toolbar label. @@ -156,15 +156,15 @@ A locale object must include translations for every Kanban and Toolbar label. Kanban exports the following built-in locales: -- `"en"` — English -- `"de"` — German -- `"cn"` — Chinese -- `"es"` — Spanish -- `"fr"` — French -- `"it"` — Italian -- `"jp"` — Japanese -- `"pt"` — Portuguese -- `"ru"` — Russian +- `"en"` - English +- `"de"` - German +- `"cn"` - Chinese +- `"es"` - Spanish +- `"fr"` - French +- `"it"` - Italian +- `"jp"` - Japanese +- `"pt"` - Portuguese +- `"ru"` - Russian Access a locale through `kanban.locales[""]`. The Toolbar is a separate component, so apply the locale to the Toolbar independently. The following code snippet applies the `"cn"` locale to both Kanban and the Toolbar at initialization: diff --git a/docs/guides/stylization.md b/docs/guides/stylization.md index d9a7843..a65c95f 100644 --- a/docs/guides/stylization.md +++ b/docs/guides/stylization.md @@ -8,8 +8,8 @@ description: Read the DHTMLX Kanban stylization guide. Learn how to style cards, You can style the Kanban appearance through CSS classes and CSS variables. The following properties accept CSS classes for columns, rows, and cards: -- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) — functions that return a CSS class conditionally based on item data -- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) — string CSS class assigned to a single item +- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) - functions that return a CSS class conditionally based on item data +- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) - string CSS class assigned to a single item For details and code examples of the conditional `css` functions, see [Conditional CSS classes](guides/customization.md#conditional-css-classes). @@ -32,8 +32,8 @@ const cards = [ Beyond per-item CSS, Kanban exposes CSS variables for theming. Variables fall into two groups: -- Kanban variables — define Kanban-specific styles -- WX library variables — style shared UI elements (controls, calendars) +- Kanban variables - define Kanban-specific styles +- WX library variables - style shared UI elements (controls, calendars) :::info The WX library powers internal Kanban UI components. Treat WX variables as part of Kanban styling. diff --git a/docs/guides/working_with_data.md b/docs/guides/working_with_data.md index a60337c..2c46128 100644 --- a/docs/guides/working_with_data.md +++ b/docs/guides/working_with_data.md @@ -146,62 +146,62 @@ For multi-widget integration, see [Integration with DHTMLX widgets](guides/integ ## Get data -- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) — gets data objects of all cards in the specified column (and optionally row) -- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) — gets data objects of all cards in the specified column -- [`getCard()`](api/methods/js_kanban_getcard_method.md) — gets a card data object by ID -- [`serialize()`](api/methods/js_kanban_serialize_method.md) — returns Kanban data as a JSON object +- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) - gets data objects of all cards in the specified column (and optionally row) +- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) - gets data objects of all cards in the specified column +- [`getCard()`](api/methods/js_kanban_getcard_method.md) - gets a card data object by ID +- [`serialize()`](api/methods/js_kanban_serialize_method.md) - returns Kanban data as a JSON object ## Get state -- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) — gets reactive properties of the *DataStore* -- [`api.getState()`](api/internal/js_kanban_getstate_method.md) — gets current properties of the *DataStore* -- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) — returns `{ data: DataStore }` +- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) - gets reactive properties of the *DataStore* +- [`api.getState()`](api/internal/js_kanban_getstate_method.md) - gets current properties of the *DataStore* +- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) - returns `{ data: DataStore }` ## Export data -- [`export.json()`](api/internal/js_kanban_json_method.md) — downloads Kanban data as a JSON file +- [`export.json()`](api/internal/js_kanban_json_method.md) - downloads Kanban data as a JSON file ## Add new items -- [`addCard()`](api/methods/js_kanban_addcard_method.md) — adds a new card -- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) — adds a new column -- [`addRow()`](api/methods/js_kanban_addrow_method.md) — adds a new row -- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) — duplicates a card by ID +- [`addCard()`](api/methods/js_kanban_addcard_method.md) - adds a new card +- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) - adds a new column +- [`addRow()`](api/methods/js_kanban_addrow_method.md) - adds a new row +- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) - duplicates a card by ID ## Update items -- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) — updates a card by ID -- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) — updates a column by ID -- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) — updates a row by ID +- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) - updates a card by ID +- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) - updates a column by ID +- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) - updates a row by ID ## Delete items -- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) — removes a card by ID -- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) — removes a column by ID -- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) — removes a row by ID +- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) - removes a card by ID +- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) - removes a column by ID +- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) - removes a row by ID ## Move items -- [`moveCard()`](api/methods/js_kanban_movecard_method.md) — moves a card to the target column and row -- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) — moves a column to a new position -- [`moveRow()`](api/methods/js_kanban_moverow_method.md) — moves a row to a new position +- [`moveCard()`](api/methods/js_kanban_movecard_method.md) - moves a card to the target column and row +- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) - moves a column to a new position +- [`moveRow()`](api/methods/js_kanban_moverow_method.md) - moves a row to a new position ## Manage comments -- [`addComment()`](api/methods/js_kanban_addcomment_method.md) — adds a comment to a card by ID -- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) — updates a comment by ID -- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) — deletes a comment by ID +- [`addComment()`](api/methods/js_kanban_addcomment_method.md) - adds a comment to a card by ID +- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) - updates a comment by ID +- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) - deletes a comment by ID ## Manage links -- [`addLink()`](api/methods/js_kanban_addlink_method.md) — adds a new link between cards -- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) — deletes a link by ID +- [`addLink()`](api/methods/js_kanban_addlink_method.md) - adds a new link between cards +- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) - deletes a link by ID ## Manage card selection -- [`getSelection()`](api/methods/js_kanban_getselection_method.md) — gets IDs of the currently selected cards -- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) — selects a card by ID -- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) — unselects a card by ID +- [`getSelection()`](api/methods/js_kanban_getselection_method.md) - gets IDs of the currently selected cards +- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) - selects a card by ID +- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) - unselects a card by ID ## Example diff --git a/docs/guides/working_with_server.md b/docs/guides/working_with_server.md index 5f4ccf9..953dfbf 100644 --- a/docs/guides/working_with_server.md +++ b/docs/guides/working_with_server.md @@ -40,20 +40,20 @@ JavaScript Kanban includes the `RestDataProvider` service, which fully supports The `RestDataProvider` service exposes the following REST methods: -- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) — gets a promise with cards data -- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) — gets a promise with columns data -- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) — returns the default action handlers used by the provider -- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) — returns a function that resolves temporary client IDs to backend IDs -- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) — gets a promise with links data -- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) — returns the internal queue of actions processed by the provider -- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) — gets a promise with rows data -- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) — gets a promise with users data -- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) — sends a custom HTTP request and returns a promise -- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) — sets custom HTTP headers attached to every request +- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) - gets a promise with cards data +- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) - gets a promise with columns data +- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) - returns the default action handlers used by the provider +- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) - returns a function that resolves temporary client IDs to backend IDs +- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) - gets a promise with links data +- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) - returns the internal queue of actions processed by the provider +- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) - gets a promise with rows data +- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) - gets a promise with users data +- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) - sends a custom HTTP request and returns a promise +- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) - sets custom HTTP headers attached to every request ## Customize RestDataProvider -To customize how `RestDataProvider` sends data operations to the server, extend the class and override one of its methods. Most often, customization targets the default action handlers — for example, to add a handler for a custom event or to extend the payload of an existing operation. +To customize how `RestDataProvider` sends data operations to the server, extend the class and override one of its methods. Most often, customization targets the default action handlers, for example to add a handler for a custom event or to extend the payload of an existing operation. To add custom handlers without losing the default ones, override [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) and merge custom entries on top of `super.getHandlers()`: @@ -75,7 +75,7 @@ board.api.setNext(restProvider); ~~~ :::warning -Always call `super.getHandlers()` from the override and spread its result. Do not copy the default handlers into the override manually — the actions map may change between versions, so a hard-coded copy can silently get out of sync with the current defaults. +Always call `super.getHandlers()` from the override and spread its result. Do not copy the default handlers into the override manually. The actions map may change between versions, so a hard-coded copy can silently get out of sync with the current defaults. ::: Another common customization target is the [`send()`](api/provider/rest_methods/js_kanban_send_method.md) method, which is called by every default handler. Override `send()` to inject extra headers, rewrite URLs, or wrap every server request with custom logic. @@ -218,8 +218,8 @@ events.on(handlers); The snippet uses the following identifiers: -- `handlers` — client handlers for server events -- `events` — `RemoteEvents` instance that listens for incoming events from the server +- `handlers` - client handlers for server events +- `events` - `RemoteEvents` instance that listens for incoming events from the server The `events.on(handlers)` call registers the client handlers for the server-side events. The widget now reflects server-side changes in real time. @@ -295,11 +295,11 @@ The `RestDataProvider.getIDResolver()` method returns a function that synchroniz The `type` argument identifies the model type: -- `CardID` — `1` -- `RowID` — `2` -- `ColumnID` — `3` -- `LinkID` — `4` -- `CommentID` — `5` +- `CardID` - `1` +- `RowID` - `2` +- `ColumnID` - `3` +- `LinkID` - `4` +- `CommentID` - `5` To prevent the request from going to the server, pass `skipProvider: true` when you call `board.api.exec()`. The `remoteEvents.on(handlers)` call registers the custom handlers. @@ -311,9 +311,9 @@ To implement grouping, add a custom field (for example, `status`) that stores th Define grouping rules. In the example below, the grouping uses these statuses: -- `todo`, `unassigned` — for the **Open** column -- `dev`, `testing` — for the **Inprogress** column -- `merged`, `released` — for the **Done** column +- `todo`, `unassigned` - for the **Open** column +- `dev`, `testing` - for the **Inprogress** column +- `merged`, `released` - for the **Done** column Two implementation paths are available: diff --git a/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md b/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md index f528eb2..89ffc7f 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md @@ -20,7 +20,7 @@ cardHeight?: number; // px Wenn Sie die Einstellungen [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) und [`scrollType: "default"`](api/config/js_kanban_scrolltype_config.md) kombinieren, vergessen Sie nicht, eine statische Höhe für die Karten über die Eigenschaft `cardHeight` anzugeben. Wenn Sie dies nicht tun, werden die Karten nicht angezeigt. Wenn Sie [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) gemeinsam mit [`scrollType: "column"`](api/config/js_kanban_scrolltype_config.md) verwenden, sollten Sie ebenfalls die Höhe der Karten über die Eigenschaft `cardHeight` festlegen. Obwohl für diesen Layouttyp eine variable Kartenhöhe unterstützt wird, kann dies mit individuellem Karteninhalt unter Umständen nicht stabil funktionieren. -Wenn `cardHeight` nicht angegeben ist, greift das Widget auf eine experimentelle Schätzung der Kartenhöhen zurück, die auf den in [`cardShape`](api/config/js_kanban_cardshape_config.md) deklarierten sichtbaren Feldern basiert. Bei einem benutzerdefinierten [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) gilt diese Schätzung nicht — in diesem Fall entweder `cardHeight` explizit setzen oder eine benutzerdefinierte [`getCardHeight`](api/config/js_kanban_getcardheight_config.md)-Funktion bereitstellen. +Wenn `cardHeight` nicht angegeben ist, greift das Widget auf eine experimentelle Schätzung der Kartenhöhen zurück, die auf den in [`cardShape`](api/config/js_kanban_cardshape_config.md) deklarierten sichtbaren Feldern basiert. Bei einem benutzerdefinierten [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) gilt diese Schätzung nicht. Setzen Sie in diesem Fall entweder `cardHeight` explizit oder stellen Sie eine benutzerdefinierte [`getCardHeight`](api/config/js_kanban_getcardheight_config.md)-Funktion bereit. ::: ### Beispiel diff --git a/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md b/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md index 929d28c..38288cc 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md @@ -30,7 +30,7 @@ Die Callback-Funktion erhält folgende Argumente: - `card` - das Datenobjekt der Karte - `cardWidth` - die aktuelle Breite der Karte in Pixeln -Die Funktion muss eine Zahl zurückgeben — die geschätzte Höhe der Karte in Pixeln. +Die Funktion muss die geschätzte Höhe der Karte in Pixeln zurückgeben. ### Standardkonfiguration diff --git a/i18n/de/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md b/i18n/de/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md index 0ac5671..5e85e01 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md @@ -24,13 +24,13 @@ getIDResolver(): (id: string | number, type: number) => string | number; Die Methode gibt eine `idResolver(id, type)`-Funktion zurück: -- `id` — die aufzulösende Entitäts-ID (eine temporäre clientseitige ID oder eine reguläre ID) -- `type` — der Modelltyp, zu dem die ID gehört: - - `1` — Karte (`CardID`) - - `2` — Zeile (`RowID`) - - `3` — Spalte (`ColumnID`) - - `4` — Verknüpfung (`LinkID`) - - `5` — Kommentar (`CommentID`) +- `id` - die aufzulösende Entitäts-ID (eine temporäre clientseitige ID oder eine reguläre ID) +- `type` - der Modelltyp, zu dem die ID gehört: + - `1` - Karte (`CardID`) + - `2` - Zeile (`RowID`) + - `3` - Spalte (`ColumnID`) + - `4` - Verknüpfung (`LinkID`) + - `5` - Kommentar (`CommentID`) Wenn der Client eine neue Entität (Karte, Spalte, Zeile, Verknüpfung, Kommentar) erstellt, weist `RestDataProvider` ihr eine temporäre clientseitige ID zu und speichert die vom Server zurückgegebene Backend-ID. Die Funktion `idResolver(id, type)` gibt die Backend-ID für jede temporäre ID zurück, die sie noch enthält. Für IDs, die bereits mit der Backend-ID übereinstimmen, gibt die Funktion sie unverändert zurück. diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/configuration.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/configuration.md index 9c6e3bf..1529265 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/configuration.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/configuration.md @@ -8,38 +8,38 @@ description: Lesen Sie das DHTMLX-Kanban-Konfigurationshandbuch. Erfahren Sie, w Das Aussehen und die Funktionalität von Kanban können Sie mit den folgenden Eigenschaften konfigurieren: -- [`cardShape`](api/config/js_kanban_cardshape_config.md) — Erscheinungsbild und integrierte Felder der Karten festlegen -- [`editorShape`](api/config/js_kanban_editorshape_config.md) — Editor-Felder definieren -- [`editor`](api/config/js_kanban_editor_config.md) — Sichtbarkeit, Autosave und Platzierung des Editors steuern -- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) — Karten-Rendering und Board-Scrollen anpassen -- [`history`](api/config/js_kanban_history_config.md) — Historie der Kartenoperationen verwalten -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — Erscheinungsbild der Karten anpassen (siehe Abschnitt [Customization](guides/customization.md)) -- [`locale`](api/config/js_kanban_locale_config.md) — eine Sprache anwenden (siehe Abschnitt [Localization](guides/localization.md)) -- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) — Daten für Karten, Spalten, Zeilen und Verknüpfungen laden (siehe Abschnitt [Working with data](guides/working_with_data.md)) +- [`cardShape`](api/config/js_kanban_cardshape_config.md) - Erscheinungsbild und integrierte Felder der Karten festlegen +- [`editorShape`](api/config/js_kanban_editorshape_config.md) - Editor-Felder definieren +- [`editor`](api/config/js_kanban_editor_config.md) - Sichtbarkeit, Autosave und Platzierung des Editors steuern +- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) - Karten-Rendering und Board-Scrollen anpassen +- [`history`](api/config/js_kanban_history_config.md) - Historie der Kartenoperationen verwalten +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - Erscheinungsbild der Karten anpassen (siehe Abschnitt [Customization](guides/customization.md)) +- [`locale`](api/config/js_kanban_locale_config.md) - eine Sprache anwenden (siehe Abschnitt [Localization](guides/localization.md)) +- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) - Daten für Karten, Spalten, Zeilen und Verknüpfungen laden (siehe Abschnitt [Working with data](guides/working_with_data.md)) ## Karten {#cards} Das Kanban-Board besteht aus Karten, die auf Spalten und Zeilen verteilt sind. Verwenden Sie die [`cardShape`](api/config/js_kanban_cardshape_config.md) Eigenschaft, um das Erscheinungsbild und die integrierten Felder der Karten zu konfigurieren: -- `label: boolean | { show }` — Kartenbezeichnung, bearbeitet mit dem Typ [`text`](#text-und-textarea-typen) -- `description: boolean | { show }` — Kartenbeschreibung, bearbeitet mit dem Typ [`textarea`](#text-und-textarea-typen) -- `progress: boolean | { show }` — Kartenfortschritt, bearbeitet mit dem Typ [`progress`](#progress-typ) -- `start_date: boolean | { show, format }` — Startdatum der Karte, bearbeitet mit dem Typ [`date`](#date-und-daterange-typen) -- `end_date: boolean | { show, format }` — Enddatum der Karte, bearbeitet mit dem Typ [`date`](#date-und-daterange-typen) -- `menu: boolean | { show, items }` — Kontextmenü der Karte -- `attached: boolean | { show }` — Dateianhang der Karte, bearbeitet mit dem Typ [`files`](#files-typ) -- `color: boolean | { show, values }` — obere Farblinie der Karte, bearbeitet mit dem Typ [`color`](#color-typ) -- `cover: boolean | { show }` — Vorschaubild der Karte -- `comments: boolean | { show }` — Kommentare zur Karte -- `confirmDeletion: boolean | { show }` — Bestätigungsdialog zum Löschen der Karte -- `votes: boolean | { show, clickable }` — Abstimmungsmöglichkeit bei der Karte -- `users: boolean | { show, values, maxCount }` — der Karte zugewiesene Benutzer, bearbeitet mit den Typen [`combo`, `select` oder `multiselect`](#combo-select-und-multiselect-typen) -- `priority: boolean | { show, values }` — Kartenpriorität, bearbeitet mit dem Typ [`combo` oder `select`](#combo-select-und-multiselect-typen) -- `css: (card) => string` — Funktion, die eine CSS-Klasse zurückgibt, die bedingt auf eine Karte angewendet wird -- `headerFields: [{ key, label, css }]` — benutzerdefinierte Kartenfelder +- `label: boolean | { show }` - Kartenbezeichnung, bearbeitet mit dem Typ [`text`](#text-und-textarea-typen) +- `description: boolean | { show }` - Kartenbeschreibung, bearbeitet mit dem Typ [`textarea`](#text-und-textarea-typen) +- `progress: boolean | { show }` - Kartenfortschritt, bearbeitet mit dem Typ [`progress`](#progress-typ) +- `start_date: boolean | { show, format }` - Startdatum der Karte, bearbeitet mit dem Typ [`date`](#date-und-daterange-typen) +- `end_date: boolean | { show, format }` - Enddatum der Karte, bearbeitet mit dem Typ [`date`](#date-und-daterange-typen) +- `menu: boolean | { show, items }` - Kontextmenü der Karte +- `attached: boolean | { show }` - Dateianhang der Karte, bearbeitet mit dem Typ [`files`](#files-typ) +- `color: boolean | { show, values }` - obere Farblinie der Karte, bearbeitet mit dem Typ [`color`](#color-typ) +- `cover: boolean | { show }` - Vorschaubild der Karte +- `comments: boolean | { show }` - Kommentare zur Karte +- `confirmDeletion: boolean | { show }` - Bestätigungsdialog zum Löschen der Karte +- `votes: boolean | { show, clickable }` - Abstimmungsmöglichkeit bei der Karte +- `users: boolean | { show, values, maxCount }` - der Karte zugewiesene Benutzer, bearbeitet mit den Typen [`combo`, `select` oder `multiselect`](#combo-select-und-multiselect-typen) +- `priority: boolean | { show, values }` - Kartenpriorität, bearbeitet mit dem Typ [`combo` oder `select`](#combo-select-und-multiselect-typen) +- `css: (card) => string` - Funktion, die eine CSS-Klasse zurückgibt, die bedingt auf eine Karte angewendet wird +- `headerFields: [{ key, label, css }]` - benutzerdefinierte Kartenfelder :::tip -Wenn Sie ein Feld in `cardShape` aktivieren, zeigt der Editor das entsprechende Steuerelement automatisch an. Konfigurieren Sie jedes Steuerelement über die [`editorShape`](api/config/js_kanban_editorshape_config.md) Eigenschaft — verfügbare Typen finden Sie unter [Editor](#editor). +Wenn Sie ein Feld in `cardShape` aktivieren, zeigt der Editor das entsprechende Steuerelement automatisch an. Konfigurieren Sie jedes Steuerelement über die [`editorShape`](api/config/js_kanban_editorshape_config.md) Eigenschaft. Verfügbare Typen finden Sie unter [Editor](#editor). ::: Das folgende Code-Beispiel konfiguriert Karten mit benutzerdefinierten Benutzern, Prioritäten und einem benutzerdefinierten Header-Feld: @@ -98,14 +98,14 @@ Sofern Sie keine Karteneinstellungen über die [`cardShape`](api/config/js_kanba Der Kanban-Editor enthält Felder zur Verwaltung der Kartendaten. Verwenden Sie die [`editorShape`](api/config/js_kanban_editorshape_config.md) Eigenschaft, um Editor-Felder zu konfigurieren. Folgende Feldtypen stehen zur Verfügung: -- [`combo`, `select`, `multiselect`](#combo-select-und-multiselect-typen) — Dropdown-Optionen -- [`color`](#color-typ) — Farbauswahl -- [`text`, `textarea`](#text-und-textarea-typen) — Texteingaben -- [`progress`](#progress-typ) — Fortschrittsregler -- [`files`](#files-typ) — Datei-Upload -- [`date`, `dateRange`](#date-und-daterange-typen) — einzelnes Datum oder Datumsbereich -- [`comments`](#comments-type) — Kartenkommentare -- [`links`](#links-type) — Kartenverknüpfungen +- [`combo`, `select`, `multiselect`](#combo-select-und-multiselect-typen) - Dropdown-Optionen +- [`color`](#color-typ) - Farbauswahl +- [`text`, `textarea`](#text-und-textarea-typen) - Texteingaben +- [`progress`](#progress-typ) - Fortschrittsregler +- [`files`](#files-typ) - Datei-Upload +- [`date`, `dateRange`](#date-und-daterange-typen) - einzelnes Datum oder Datumsbereich +- [`comments`](#comments-type) - Kartenkommentare +- [`links`](#links-type) - Kartenverknüpfungen :::info Zeigen Sie den Editor als Seitenleiste oder modales Fenster an, indem Sie die [`editor.placement`](api/config/js_kanban_editor_config.md) Eigenschaft verwenden. @@ -444,10 +444,10 @@ Sofern Sie keine Editor-Einstellungen über die [`editorShape`](api/config/js_ka Die [`editor`](api/config/js_kanban_editor_config.md) Eigenschaft steuert Sichtbarkeit, Autosave und Platzierung des Editors: -- [`editor.show`](api/config/js_kanban_editor_config.md) — Editor aktivieren oder deaktivieren -- [`editor.placement`](api/config/js_kanban_editor_config.md) — Editor als `"sidebar"` oder `"modal"`-Fenster anzeigen -- [`editor.autoSave`](api/config/js_kanban_editor_config.md) — Autosave-Modus aktivieren oder deaktivieren -- [`editor.debounce`](api/config/js_kanban_editor_config.md) — Verzögerung vor dem automatischen Speichern (gilt nur mit `autoSave: true`) +- [`editor.show`](api/config/js_kanban_editor_config.md) - Editor aktivieren oder deaktivieren +- [`editor.placement`](api/config/js_kanban_editor_config.md) - Editor als `"sidebar"` oder `"modal"`-Fenster anzeigen +- [`editor.autoSave`](api/config/js_kanban_editor_config.md) - Autosave-Modus aktivieren oder deaktivieren +- [`editor.debounce`](api/config/js_kanban_editor_config.md) - Verzögerung vor dem automatischen Speichern (gilt nur mit `autoSave: true`) Das folgende Code-Beispiel aktiviert Autosave mit einer Verzögerung von 2 Sekunden: @@ -469,8 +469,8 @@ new kanban.Kanban("#root", { Standardmäßig rendert das Kanban-Widget alle Karten und scrollt das gesamte Board. Bei Boards mit vielen Karten können Sie auf Lazy Rendering oder spaltenweises Scrollen umschalten: -- [`renderType`](api/config/js_kanban_rendertype_config.md) — auf `"lazy"` setzen, um nur die auf dem Board sichtbaren Karten zu rendern -- [`scrollType`](api/config/js_kanban_scrolltype_config.md) — auf `"column"` setzen, um jede Spalte unabhängig zu scrollen +- [`renderType`](api/config/js_kanban_rendertype_config.md) - auf `"lazy"` setzen, um nur die auf dem Board sichtbaren Karten zu rendern +- [`scrollType`](api/config/js_kanban_scrolltype_config.md) - auf `"column"` setzen, um jede Spalte unabhängig zu scrollen Das folgende Code-Beispiel aktiviert Lazy Rendering und spaltenweises Scrollen: @@ -488,7 +488,7 @@ new kanban.Kanban("#root", { :::important Wenn Sie `renderType: "lazy"` mit einem beliebigen `scrollType` kombinieren, legen Sie über die [`cardHeight`](api/config/js_kanban_cardheight_config.md) Eigenschaft eine statische Höhe für Karten fest. Ohne `cardHeight` werden Karten beim Lazy Rendering nicht korrekt angezeigt. -Wenn `cardHeight` bei `renderType: "lazy"` und `scrollType: "column"` weggelassen wird, greift das Widget auf eine experimentelle Näherung der Kartenhöhen auf Basis der sichtbaren Felder in [`cardShape`](api/config/js_kanban_cardshape_config.md) zurück. Bei Boards mit einem benutzerdefinierten [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) kann das Widget die gerenderte Höhe nicht vorhersagen — stellen Sie eine benutzerdefinierte Funktion [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md) bereit, die die geschätzte Kartenhöhe zurückgibt. +Wenn `cardHeight` bei `renderType: "lazy"` und `scrollType: "column"` weggelassen wird, greift das Widget auf eine experimentelle Näherung der Kartenhöhen auf Basis der sichtbaren Felder in [`cardShape`](api/config/js_kanban_cardshape_config.md) zurück. Bei Boards mit einem benutzerdefinierten [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) kann das Widget die gerenderte Höhe nicht vorhersagen. Stellen Sie eine benutzerdefinierte Funktion [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md) bereit, die die geschätzte Kartenhöhe zurückgibt. ::: ## Änderungsverlauf diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/customization.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/customization.md index 30254cf..ab8b335 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/customization.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/customization.md @@ -8,12 +8,12 @@ description: Nutzen Sie die DHTMLX-Kanban-Anpassungsanleitungen, um Vorlagen, Me Das Erscheinungsbild und Verhalten von Kanban können Sie mit folgenden Eigenschaften anpassen: -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — Karten mit einer eigenen HTML-Vorlage rendern -- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) — das Kontextmenü für Karten, Spalten und Zeilen anpassen -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — Spaltenheader-Vorlagen ersetzen -- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) — CSS-Klassen bedingt anwenden -- [`items`](api/config/toolbar_items_config.md) — Toolbar-Struktur neu anordnen und eigene Steuerelemente hinzufügen -- CSS-Variablen — visuelle Stile anpassen (siehe den Abschnitt [Stilisierung](guides/stylization.md)) +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - Karten mit einer eigenen HTML-Vorlage rendern +- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) - das Kontextmenü für Karten, Spalten und Zeilen anpassen +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - Spaltenheader-Vorlagen ersetzen +- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) - CSS-Klassen bedingt anwenden +- [`items`](api/config/toolbar_items_config.md) - Toolbar-Struktur neu anordnen und eigene Steuerelemente hinzufügen +- CSS-Variablen - visuelle Stile anpassen (siehe den Abschnitt [Stilisierung](guides/stylization.md)) ## Eigene Karten {#custom-cards} @@ -21,10 +21,10 @@ Verwenden Sie die [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md)- Der Callback erhält ein Objekt mit folgenden Parametern: -- `cardFields` — Kartendaten -- `selected` — ob die Karte ausgewählt ist -- `dragging` — ob die Karte gerade verschoben wird -- `cardShape` — Kartenkonfiguration +- `cardFields` - Kartendaten +- `selected` - ob die Karte ausgewählt ist +- `dragging` - ob die Karte gerade verschoben wird +- `cardShape` - Kartenkonfiguration Um in einer eigenen Kartenvorlage einen Kontextmenü-Auslöser einzubetten, umschließen Sie das Menüsymbol mit einem `
` mit dem Attribut `data-menu-id=${cardFields.id}` (dieselbe Struktur wie bei der eingebauten Karte). Das Widget bindet das Menü über dieses Attribut an den Container. @@ -40,21 +40,21 @@ Konfigurieren Sie das Kontextmenü für Karten, Spalten und Zeilen über die Eig Standardmäßig zeigt das Kartenmenü die Optionen **Duplizieren** und **Löschen**. Verfügbare eingebaute Aktions-IDs: -- `"duplicate-card"` — die Karte duplizieren -- `"delete-card"` — die Karte löschen +- `"duplicate-card"` - die Karte duplizieren +- `"delete-card"` - die Karte löschen ### `columnShape.menu` -- `"add-card"` — eine neue Karte zur Spalte hinzufügen -- `"set-edit"` — die Spalte umbenennen -- `"move-column:left"`, `"move-column:right"` — die Spalte nach links oder rechts verschieben -- `"delete-column"` — die Spalte löschen +- `"add-card"` - eine neue Karte zur Spalte hinzufügen +- `"set-edit"` - die Spalte umbenennen +- `"move-column:left"`, `"move-column:right"` - die Spalte nach links oder rechts verschieben +- `"delete-column"` - die Spalte löschen ### `rowShape.menu` -- `"set-edit"` — die Zeile umbenennen -- `"move-row:up"`, `"move-row:down"` — die Zeile nach oben oder unten verschieben -- `"delete-row"` — die Zeile löschen +- `"set-edit"` - die Zeile umbenennen +- `"move-row:up"`, `"move-row:down"` - die Zeile nach oben oder unten verschieben +- `"delete-row"` - die Zeile löschen Setzen Sie `menu.items` auf eine Funktion, um pro Karte, Spalte oder Zeile ein unterschiedliches Menü anzuzeigen. Geben Sie `null` oder `false` aus der Funktion zurück, um das Menü für ein bestimmtes Element auszublenden. @@ -66,9 +66,9 @@ Das folgende Demo wendet ein eigenes Kontextmenü an: Die [`columnShape`](api/config/js_kanban_columnshape_config.md)-Eigenschaft stellt Vorlagen und Verhalten für Spaltenheader bereit: -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) — HTML-Vorlage des Spaltenheaders im ausgeklappten Zustand -- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — HTML-Vorlage des Spaltenheaders im eingeklappten Zustand -- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) — Spaltenheader beim vertikalen Scrollen einfrieren (Standard: `true`) +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) - HTML-Vorlage des Spaltenheaders im ausgeklappten Zustand +- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - HTML-Vorlage des Spaltenheaders im eingeklappten Zustand +- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) - Spaltenheader beim vertikalen Scrollen einfrieren (Standard: `true`) Der folgende Codeausschnitt setzt eine eigene Headervorlage mit einem Einklapp-Symbol, einem Label mit Kartenanzahl und einem Menüauslöser: @@ -103,9 +103,9 @@ Damit `fixedHeaders` wirksam wird, legen Sie eine feste Höhe am Kanban-Containe Um eine CSS-Klasse bedingt anzuwenden, übergeben Sie eine Funktion an den `css`-Parameter von [`cardShape`](api/config/js_kanban_cardshape_config.md), [`columnShape`](api/config/js_kanban_columnshape_config.md) oder [`rowShape`](api/config/js_kanban_rowshape_config.md). Die Funktion gibt einen Klassennamen basierend auf den aktuellen Daten zurück: -- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) — Klasse, die auf eine Karte angewendet wird -- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) — Klasse, die auf eine Spalte angewendet wird -- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) — Klasse, die auf eine Zeile angewendet wird +- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) - Klasse, die auf eine Karte angewendet wird +- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) - Klasse, die auf eine Spalte angewendet wird +- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) - Klasse, die auf eine Zeile angewendet wird Der folgende Codeausschnitt hebt überfällige Karten und gering ausgelastete Spalten hervor: diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/initialization.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/initialization.md index fcbb336..35232c8 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/initialization.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/initialization.md @@ -81,8 +81,8 @@ Weitere Informationen zur Konfiguration der Toolbar finden Sie im Abschnitt [Kon Die vollständige Konfigurationsreferenz: -- [Übersicht der Kanban-Eigenschaften](api/overview/properties_overview.md) — alle Kanban-Konfigurationseigenschaften -- [Übersicht der Toolbar-Eigenschaften](api/overview/toolbar_properties_overview.md) — alle Toolbar-Konfigurationseigenschaften +- [Übersicht der Kanban-Eigenschaften](api/overview/properties_overview.md) - alle Kanban-Konfigurationseigenschaften +- [Übersicht der Toolbar-Eigenschaften](api/overview/toolbar_properties_overview.md) - alle Toolbar-Konfigurationseigenschaften ## Beispiel diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md index cff5bb5..8c677f7 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md @@ -20,8 +20,8 @@ Installieren Sie [Vite](https://vite.dev/) (optional) und [Node.js](https://node Richten Sie ein Svelte-Projekt auf eine der folgenden Arten ein: -- mit [SvelteKit](https://kit.svelte.dev/) — empfohlen -- mit Svelte und Vite (ohne SvelteKit) — führen Sie aus: +- mit [SvelteKit](https://kit.svelte.dev/) - empfohlen +- mit Svelte und Vite (ohne SvelteKit) - führen Sie aus: ~~~json npm create vite@latest diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/localization.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/localization.md index cfeec67..3688ec1 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/localization.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/localization.md @@ -144,11 +144,11 @@ const en = { Ein Locale-Objekt enthält fünf Abschnitte auf oberster Ebene: -- `lang` — Sprachcode (z. B. `"en-US"`) -- `kanban` — UI-Beschriftungen (Schaltflächen, Dialoge, Suche, Sortieroptionen, Verknüpfungsbeziehungen) -- `calendar` — Beschriftungen und Einstellungen des Datumswählers (Monats- und Tagesnamen, Uhrzeitformat, Wochenbeginn, AM/PM-Markierungen) -- `formats` — Datums- und Uhrzeitformatmuster (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) -- `core` — gemeinsam genutzte Dialog-Schaltflächen (`ok`, `cancel`) +- `lang` - Sprachcode (z. B. `"en-US"`) +- `kanban` - UI-Beschriftungen (Schaltflächen, Dialoge, Suche, Sortieroptionen, Verknüpfungsbeziehungen) +- `calendar` - Beschriftungen und Einstellungen des Datumswählers (Monats- und Tagesnamen, Uhrzeitformat, Wochenbeginn, AM/PM-Markierungen) +- `formats` - Datums- und Uhrzeitformatmuster (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) +- `core` - gemeinsam genutzte Dialog-Schaltflächen (`ok`, `cancel`) Ein Locale-Objekt muss Übersetzungen für alle Beschriftungen von Kanban und Toolbar enthalten. @@ -156,15 +156,15 @@ Ein Locale-Objekt muss Übersetzungen für alle Beschriftungen von Kanban und To Kanban stellt die folgenden integrierten Sprachumgebungen bereit: -- `"en"` — Englisch -- `"de"` — Deutsch -- `"cn"` — Chinesisch -- `"es"` — Spanisch -- `"fr"` — Französisch -- `"it"` — Italienisch -- `"jp"` — Japanisch -- `"pt"` — Portugiesisch -- `"ru"` — Russisch +- `"en"` - Englisch +- `"de"` - Deutsch +- `"cn"` - Chinesisch +- `"es"` - Spanisch +- `"fr"` - Französisch +- `"it"` - Italienisch +- `"jp"` - Japanisch +- `"pt"` - Portugiesisch +- `"ru"` - Russisch Der Zugriff auf eine Sprachumgebung erfolgt über `kanban.locales[""]`. Da die Toolbar eine separate Komponente ist, muss die Sprachumgebung unabhängig auf sie angewendet werden. Das folgende Code-Snippet wendet die Sprachumgebung `"cn"` bei der Initialisierung auf Kanban und die Toolbar an: diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/mcp-server.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/mcp-server.md index 9eafa65..b0a3dee 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/mcp-server.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/mcp-server.md @@ -1,12 +1,12 @@ --- sidebar_label: DHTMLX MCP-Server title: DHTMLX Kanban MCP-Integration für Boards und REST-Synchronisierung -description: Der MCP-Server gibt KI-Tools Zugriff auf die aktuelle DHTMLX Kanban-Dokumentation — zu Karten, Spalten, Zeilen, Editor-Feldern und der REST-Datensynchronisierung. +description: Der MCP-Server gibt KI-Tools Zugriff auf die aktuelle DHTMLX Kanban-Dokumentation zu Karten, Spalten, Zeilen, Editor-Feldern und der REST-Datensynchronisierung. --- # DHTMLX Kanban MCP-Server: Karten, Editor und REST-Synchronisierung -Ein funktionierendes [DHTMLX Kanban](/)-Board setzt voraus, dass mehrere Teile korrekt zusammenspielen: Karten- und Editor-Felder müssen sich [denselben Key teilen](guides/configuration.md#bind-editor-fields-to-card-fields), die [Toolbar](guides/customization.md#custom-toolbar) läuft als eigenes Widget, das an das Board gebunden ist, und die [Server-Synchronisierung](guides/working_with_server.md) stützt sich auf einen bestimmten Satz von Action-Handlern. Generierter Code hält stand, wenn Karten- und Editor-Felder denselben Key verwenden, die Toolbar separat eingebunden ist und die Server-Synchronisierung auf den heutigen Action-Handlern beruht — nicht auf einem Stand aus den Trainingsdaten. +Ein funktionierendes [DHTMLX Kanban](/)-Board setzt voraus, dass mehrere Teile korrekt zusammenspielen: Karten- und Editor-Felder müssen sich [denselben Key teilen](guides/configuration.md#bind-editor-fields-to-card-fields), die [Toolbar](guides/customization.md#custom-toolbar) läuft als eigenes Widget, das an das Board gebunden ist, und die [Server-Synchronisierung](guides/working_with_server.md) stützt sich auf einen bestimmten Satz von Action-Handlern. Generierter Code hält stand, wenn Karten- und Editor-Felder denselben Key verwenden, die Toolbar separat eingebunden ist und die Server-Synchronisierung auf den heutigen Action-Handlern beruht und nicht auf einem Stand aus den Trainingsdaten. Der DHTMLX MCP-Server sorgt dafür, dass der Assistent mit der aktuellen Kanban-Dokumentation arbeitet statt zu raten. Fragen Sie nach dem [Binden von Editor-Feldern an Karten-Felder](guides/configuration.md#bind-editor-fields-to-card-fields), nach dem [Anpassen der Toolbar](guides/customization.md#custom-toolbar) oder nach dem [Anbinden eines RestDataProvider-Backends](guides/working_with_server.md), und der Assistent ruft die aktuelle Referenz ab, bevor er Code schreibt. @@ -51,7 +51,7 @@ So bleiben Kanban-Codevorschläge auf dem Stand der API, wie sie heute funktioni ## Den MCP-Server pro Tool registrieren -Ob über das Terminal oder über eine Konfigurationsdatei — in beiden Fällen verweisen Sie Ihr Tool auf die untenstehende URL. Nach der Registrierung erreicht jedes Kanban-Board, das Sie in diesem Tool bauen, den Server. +Ob über das Terminal oder über eine Konfigurationsdatei: In beiden Fällen verweisen Sie Ihr Tool auf die untenstehende URL. Nach der Registrierung erreicht jedes Kanban-Board, das Sie in diesem Tool bauen, den Server. ~~~jsx https://docs.dhtmlx.com/mcp @@ -187,7 +187,7 @@ Für intensive Coding-Workflows sind andere MCP-fähige Tools womöglich besser ### Weitere Tools -Tools ohne eigenen Abschnitt hier unterstützen MCP in der Regel trotzdem — in den Einstellungen meist als "Model Context Protocol" oder "Context Sources" bezeichnet. Tragen Sie dort `https://docs.dhtmlx.com/mcp` als eigene Quelle ein. +Tools ohne eigenen Abschnitt hier unterstützen MCP in der Regel trotzdem, in den Einstellungen meist als "Model Context Protocol" oder "Context Sources" bezeichnet. Tragen Sie dort `https://docs.dhtmlx.com/mcp` als eigene Quelle ein. ## Was der MCP-Server mit Ihren Daten macht diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/stylization.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/stylization.md index 426357b..62de829 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/stylization.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/stylization.md @@ -8,8 +8,8 @@ description: Lesen Sie die DHTMLX Kanban-Stilierungsanleitung. Erfahren Sie, wie Sie können das Erscheinungsbild von Kanban über CSS-Klassen und CSS-Variablen anpassen. Die folgenden Eigenschaften akzeptieren CSS-Klassen für Spalten, Zeilen und Karten: -- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) — Funktionen, die eine CSS-Klasse bedingt basierend auf den Element-Daten zurückgeben -- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) — eine CSS-Klasse als Zeichenfolge, die einem einzelnen Element zugewiesen wird +- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) - Funktionen, die eine CSS-Klasse bedingt basierend auf den Element-Daten zurückgeben +- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) - eine CSS-Klasse als Zeichenfolge, die einem einzelnen Element zugewiesen wird Weitere Details und Codebeispiele zu den bedingten `css`-Funktionen finden Sie unter [Bedingte CSS-Klassen](guides/customization.md#conditional-css-classes). @@ -32,8 +32,8 @@ const cards = [ Neben elementspezifischem CSS stellt Kanban CSS-Variablen für das Theming bereit. Die Variablen gliedern sich in zwei Gruppen: -- Kanban-Variablen — definieren Kanban-spezifische Stile -- WX-Bibliotheksvariablen — gestalten gemeinsam genutzte UI-Elemente (Steuerelemente, Kalender) +- Kanban-Variablen - definieren Kanban-spezifische Stile +- WX-Bibliotheksvariablen - gestalten gemeinsam genutzte UI-Elemente (Steuerelemente, Kalender) :::info Die WX-Bibliothek stellt interne Kanban-UI-Komponenten bereit. Behandeln Sie WX-Variablen als Teil der Kanban-Stilierung. diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_data.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_data.md index b1d3fb7..621563e 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_data.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_data.md @@ -146,62 +146,62 @@ Für die Integration mit mehreren Widgets siehe [Integration mit DHTMLX-Widgets] ## Daten abrufen -- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) — gibt Datenobjekte aller Karten der angegebenen Spalte (und optional Zeile) zurück -- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) — gibt Datenobjekte aller Karten der angegebenen Spalte zurück -- [`getCard()`](api/methods/js_kanban_getcard_method.md) — gibt ein Datenobjekt einer Karte anhand der ID zurück -- [`serialize()`](api/methods/js_kanban_serialize_method.md) — gibt die Kanban-Daten als JSON-Objekt zurück +- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) - gibt Datenobjekte aller Karten der angegebenen Spalte (und optional Zeile) zurück +- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) - gibt Datenobjekte aller Karten der angegebenen Spalte zurück +- [`getCard()`](api/methods/js_kanban_getcard_method.md) - gibt ein Datenobjekt einer Karte anhand der ID zurück +- [`serialize()`](api/methods/js_kanban_serialize_method.md) - gibt die Kanban-Daten als JSON-Objekt zurück ## Status abrufen -- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) — gibt die reaktiven Eigenschaften des *DataStore* zurück -- [`api.getState()`](api/internal/js_kanban_getstate_method.md) — gibt die aktuellen Eigenschaften des *DataStore* zurück -- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) — gibt `{ data: DataStore }` zurück +- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) - gibt die reaktiven Eigenschaften des *DataStore* zurück +- [`api.getState()`](api/internal/js_kanban_getstate_method.md) - gibt die aktuellen Eigenschaften des *DataStore* zurück +- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) - gibt `{ data: DataStore }` zurück ## Daten exportieren -- [`export.json()`](api/internal/js_kanban_json_method.md) — lädt die Kanban-Daten als JSON-Datei herunter +- [`export.json()`](api/internal/js_kanban_json_method.md) - lädt die Kanban-Daten als JSON-Datei herunter ## Neue Elemente hinzufügen -- [`addCard()`](api/methods/js_kanban_addcard_method.md) — fügt eine neue Karte hinzu -- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) — fügt eine neue Spalte hinzu -- [`addRow()`](api/methods/js_kanban_addrow_method.md) — fügt eine neue Zeile hinzu -- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) — dupliziert eine Karte anhand der ID +- [`addCard()`](api/methods/js_kanban_addcard_method.md) - fügt eine neue Karte hinzu +- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) - fügt eine neue Spalte hinzu +- [`addRow()`](api/methods/js_kanban_addrow_method.md) - fügt eine neue Zeile hinzu +- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) - dupliziert eine Karte anhand der ID ## Elemente aktualisieren -- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) — aktualisiert eine Karte anhand der ID -- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) — aktualisiert eine Spalte anhand der ID -- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) — aktualisiert eine Zeile anhand der ID +- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) - aktualisiert eine Karte anhand der ID +- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) - aktualisiert eine Spalte anhand der ID +- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) - aktualisiert eine Zeile anhand der ID ## Elemente löschen -- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) — entfernt eine Karte anhand der ID -- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) — entfernt eine Spalte anhand der ID -- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) — entfernt eine Zeile anhand der ID +- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) - entfernt eine Karte anhand der ID +- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) - entfernt eine Spalte anhand der ID +- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) - entfernt eine Zeile anhand der ID ## Elemente verschieben -- [`moveCard()`](api/methods/js_kanban_movecard_method.md) — verschiebt eine Karte in die Zielspalte und -zeile -- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) — verschiebt eine Spalte an eine neue Position -- [`moveRow()`](api/methods/js_kanban_moverow_method.md) — verschiebt eine Zeile an eine neue Position +- [`moveCard()`](api/methods/js_kanban_movecard_method.md) - verschiebt eine Karte in die Zielspalte und -zeile +- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) - verschiebt eine Spalte an eine neue Position +- [`moveRow()`](api/methods/js_kanban_moverow_method.md) - verschiebt eine Zeile an eine neue Position ## Kommentare verwalten -- [`addComment()`](api/methods/js_kanban_addcomment_method.md) — fügt einer Karte anhand der ID einen Kommentar hinzu -- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) — aktualisiert einen Kommentar anhand der ID -- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) — löscht einen Kommentar anhand der ID +- [`addComment()`](api/methods/js_kanban_addcomment_method.md) - fügt einer Karte anhand der ID einen Kommentar hinzu +- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) - aktualisiert einen Kommentar anhand der ID +- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) - löscht einen Kommentar anhand der ID ## Links verwalten -- [`addLink()`](api/methods/js_kanban_addlink_method.md) — fügt einen neuen Link zwischen Karten hinzu -- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) — löscht einen Link anhand der ID +- [`addLink()`](api/methods/js_kanban_addlink_method.md) - fügt einen neuen Link zwischen Karten hinzu +- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) - löscht einen Link anhand der ID ## Kartenauswahl verwalten -- [`getSelection()`](api/methods/js_kanban_getselection_method.md) — gibt die IDs der aktuell ausgewählten Karten zurück -- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) — wählt eine Karte anhand der ID aus -- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) — hebt die Auswahl einer Karte anhand der ID auf +- [`getSelection()`](api/methods/js_kanban_getselection_method.md) - gibt die IDs der aktuell ausgewählten Karten zurück +- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) - wählt eine Karte anhand der ID aus +- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) - hebt die Auswahl einer Karte anhand der ID auf ## Beispiel diff --git a/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_server.md b/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_server.md index 00c3825..07e5d33 100644 --- a/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_server.md +++ b/i18n/de/docusaurus-plugin-content-docs/current/guides/working_with_server.md @@ -40,20 +40,20 @@ JavaScript Kanban enthält den `RestDataProvider`-Service, der die REST API voll Der `RestDataProvider`-Service stellt folgende REST-Methoden bereit: -- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) — gibt ein Promise mit den Kartendaten zurück -- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) — gibt ein Promise mit den Spaltendaten zurück -- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) — gibt die Standard-Aktions-Handler zurück, die vom Provider verwendet werden -- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) — gibt eine Funktion zurück, die temporäre Client-IDs in Backend-IDs auflöst -- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) — gibt ein Promise mit den Verbindungsdaten zurück -- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) — gibt die interne Warteschlange der vom Provider verarbeiteten Aktionen zurück -- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) — gibt ein Promise mit den Zeilendaten zurück -- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) — gibt ein Promise mit den Benutzerdaten zurück -- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) — sendet eine benutzerdefinierte HTTP-Anfrage und gibt ein Promise zurück -- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) — setzt benutzerdefinierte HTTP-Header, die an jede Anfrage angehängt werden +- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) - gibt ein Promise mit den Kartendaten zurück +- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) - gibt ein Promise mit den Spaltendaten zurück +- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) - gibt die Standard-Aktions-Handler zurück, die vom Provider verwendet werden +- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) - gibt eine Funktion zurück, die temporäre Client-IDs in Backend-IDs auflöst +- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) - gibt ein Promise mit den Verbindungsdaten zurück +- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) - gibt die interne Warteschlange der vom Provider verarbeiteten Aktionen zurück +- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) - gibt ein Promise mit den Zeilendaten zurück +- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) - gibt ein Promise mit den Benutzerdaten zurück +- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) - sendet eine benutzerdefinierte HTTP-Anfrage und gibt ein Promise zurück +- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) - setzt benutzerdefinierte HTTP-Header, die an jede Anfrage angehängt werden ## RestDataProvider anpassen -Um anzupassen, wie `RestDataProvider` Datenoperationen an den Server sendet, erweitern Sie die Klasse und überschreiben Sie eine ihrer Methoden. Meist zielt die Anpassung auf die Standard-Aktions-Handler — zum Beispiel um einen Handler für ein benutzerdefiniertes Ereignis hinzuzufügen oder den Payload einer vorhandenen Operation zu erweitern. +Um anzupassen, wie `RestDataProvider` Datenoperationen an den Server sendet, erweitern Sie die Klasse und überschreiben Sie eine ihrer Methoden. Meist zielt die Anpassung auf die Standard-Aktions-Handler, zum Beispiel um einen Handler für ein benutzerdefiniertes Ereignis hinzuzufügen oder den Payload einer vorhandenen Operation zu erweitern. Um eigene Handler hinzuzufügen, ohne die Standardhandler zu verlieren, überschreiben Sie [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) und führen Sie benutzerdefinierte Einträge mit `super.getHandlers()` zusammen: @@ -75,7 +75,7 @@ board.api.setNext(restProvider); ~~~ :::warning -Rufen Sie in der Überschreibung immer `super.getHandlers()` auf und spreaden Sie das Ergebnis. Kopieren Sie die Standard-Handler nicht manuell in die Überschreibung — die Aktionszuordnung kann sich zwischen Versionen ändern, sodass eine fest kodierte Kopie stillschweigend nicht mehr mit den aktuellen Standards übereinstimmt. +Rufen Sie in der Überschreibung immer `super.getHandlers()` auf und spreaden Sie das Ergebnis. Kopieren Sie die Standard-Handler nicht manuell in die Überschreibung. Die Aktionszuordnung kann sich zwischen Versionen ändern, sodass eine fest kodierte Kopie stillschweigend nicht mehr mit den aktuellen Standards übereinstimmt. ::: Ein weiteres häufiges Anpassungsziel ist die Methode [`send()`](api/provider/rest_methods/js_kanban_send_method.md), die von jedem Standard-Handler aufgerufen wird. Überschreiben Sie `send()`, um zusätzliche Header einzufügen, URLs umzuschreiben oder jede Serveranfrage mit eigener Logik zu umhüllen. @@ -218,8 +218,8 @@ events.on(handlers); Der Ausschnitt verwendet folgende Bezeichner: -- `handlers` — Client-Handler für Server-Ereignisse -- `events` — `RemoteEvents`-Instanz, die eingehende Ereignisse vom Server abhört +- `handlers` - Client-Handler für Server-Ereignisse +- `events` - `RemoteEvents`-Instanz, die eingehende Ereignisse vom Server abhört Der Aufruf `events.on(handlers)` registriert die Client-Handler für die serverseitigen Ereignisse. Das Widget spiegelt nun serverseitige Änderungen in Echtzeit wider. @@ -295,11 +295,11 @@ Die Methode `RestDataProvider.getIDResolver()` gibt eine Funktion zurück, die C Das Argument `type` gibt den Modelltyp an: -- `CardID` — `1` -- `RowID` — `2` -- `ColumnID` — `3` -- `LinkID` — `4` -- `CommentID` — `5` +- `CardID` - `1` +- `RowID` - `2` +- `ColumnID` - `3` +- `LinkID` - `4` +- `CommentID` - `5` Um zu verhindern, dass die Anfrage an den Server gesendet wird, übergeben Sie `skipProvider: true` beim Aufruf von `board.api.exec()`. Der Aufruf `remoteEvents.on(handlers)` registriert die eigenen Handler. @@ -311,9 +311,9 @@ Um die Gruppierung zu implementieren, fügen Sie ein benutzerdefiniertes Feld (z Definieren Sie Gruppierungsregeln. Im folgenden Beispiel verwendet die Gruppierung diese Status: -- `todo`, `unassigned` — für die Spalte **Open** -- `dev`, `testing` — für die Spalte **Inprogress** -- `merged`, `released` — für die Spalte **Done** +- `todo`, `unassigned` - für die Spalte **Open** +- `dev`, `testing` - für die Spalte **Inprogress** +- `merged`, `released` - für die Spalte **Done** Es stehen zwei Implementierungswege zur Verfügung: diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md b/i18n/ko/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md index eb2d17f..a84ec33 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md @@ -24,13 +24,13 @@ getIDResolver(): (id: string | number, type: number) => string | number; 이 메서드는 `idResolver(id, type)` 함수를 반환합니다: -- `id` — 변환할 엔티티 ID (임시 클라이언트 측 ID 또는 일반 ID) -- `type` — ID가 속한 모델 타입: - - `1` — 카드 (`CardID`) - - `2` — 행 (`RowID`) - - `3` — 열 (`ColumnID`) - - `4` — 링크 (`LinkID`) - - `5` — 댓글 (`CommentID`) +- `id` - 변환할 엔티티 ID (임시 클라이언트 측 ID 또는 일반 ID) +- `type` - ID가 속한 모델 타입: + - `1` - 카드 (`CardID`) + - `2` - 행 (`RowID`) + - `3` - 열 (`ColumnID`) + - `4` - 링크 (`LinkID`) + - `5` - 댓글 (`CommentID`) 클라이언트에서 새 엔티티(카드, 열, 행, 링크, 댓글)를 생성할 때, `RestDataProvider`는 임시 클라이언트 측 ID를 할당하고 서버에서 반환한 백엔드 ID를 기억합니다. `idResolver(id, type)` 함수는 보유 중인 임시 ID에 대해 백엔드 ID를 반환합니다. 이미 백엔드 ID와 일치하는 ID의 경우 변환 없이 그대로 반환합니다. diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/configuration.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/configuration.md index 22db791..3b81583 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/configuration.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/configuration.md @@ -8,35 +8,35 @@ description: DHTMLX Kanban 구성 가이드를 확인하세요. 카드, 열, 행 Kanban의 외관과 기능은 다음 속성으로 구성할 수 있습니다: -- [`cardShape`](api/config/js_kanban_cardshape_config.md) — 카드 외관 및 내장 필드 설정 -- [`editorShape`](api/config/js_kanban_editorshape_config.md) — 에디터 필드 정의 -- [`editor`](api/config/js_kanban_editor_config.md) — 에디터 표시 여부, 자동 저장, 배치 제어 -- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) — 카드 렌더링 및 보드 스크롤 조정 -- [`history`](api/config/js_kanban_history_config.md) — 카드 작업 기록 관리 -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — 카드 외관 커스터마이즈([커스터마이징](guides/customization.md) 섹션 참고) -- [`locale`](api/config/js_kanban_locale_config.md) — 로케일 적용([로컬라이제이션](guides/localization.md) 섹션 참고) -- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) — 카드, 컬럼, 행, 링크 데이터 로드([데이터 작업](guides/working_with_data.md) 섹션 참고) +- [`cardShape`](api/config/js_kanban_cardshape_config.md) - 카드 외관 및 내장 필드 설정 +- [`editorShape`](api/config/js_kanban_editorshape_config.md) - 에디터 필드 정의 +- [`editor`](api/config/js_kanban_editor_config.md) - 에디터 표시 여부, 자동 저장, 배치 제어 +- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) - 카드 렌더링 및 보드 스크롤 조정 +- [`history`](api/config/js_kanban_history_config.md) - 카드 작업 기록 관리 +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - 카드 외관 커스터마이즈([커스터마이징](guides/customization.md) 섹션 참고) +- [`locale`](api/config/js_kanban_locale_config.md) - 로케일 적용([로컬라이제이션](guides/localization.md) 섹션 참고) +- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) - 카드, 컬럼, 행, 링크 데이터 로드([데이터 작업](guides/working_with_data.md) 섹션 참고) ## 카드 {#cards} Kanban 보드는 컬럼과 행에 분배된 카드로 구성됩니다. [`cardShape`](api/config/js_kanban_cardshape_config.md) 속성으로 카드 외관과 내장 필드를 설정할 수 있습니다: -- `label: boolean | { show }` — 카드 레이블, [`text`](#text-and-textarea-types) 타입으로 편집 -- `description: boolean | { show }` — 카드 설명, [`textarea`](#text-and-textarea-types) 타입으로 편집 -- `progress: boolean | { show }` — 카드 진행률, [`progress`](#progress-type) 타입으로 편집 -- `start_date: boolean | { show, format }` — 카드 시작일, [`date`](#date-and-daterange-types) 타입으로 편집 -- `end_date: boolean | { show, format }` — 카드 종료일, [`date`](#date-and-daterange-types) 타입으로 편집 -- `menu: boolean | { show, items }` — 카드 컨텍스트 메뉴 -- `attached: boolean | { show }` — 카드 첨부파일, [`files`](#files-type) 타입으로 편집 -- `color: boolean | { show, values }` — 카드 상단 색상 라인, [`color`](#color-type) 타입으로 편집 -- `cover: boolean | { show }` — 카드 미리보기 이미지 -- `comments: boolean | { show }` — 카드 댓글 -- `confirmDeletion: boolean | { show }` — 카드 삭제 확인 다이얼로그 -- `votes: boolean | { show, clickable }` — 카드 투표 -- `users: boolean | { show, values, maxCount }` — 카드에 할당된 사용자, [`combo`, `select`, 또는 `multiselect`](#combo-select-and-multiselect-types) 타입으로 편집 -- `priority: boolean | { show, values }` — 카드 우선순위, [`combo` 또는 `select`](#combo-select-and-multiselect-types) 타입으로 편집 -- `css: (card) => string` — 카드에 조건부로 적용할 CSS 클래스를 반환하는 함수 -- `headerFields: [{ key, label, css }]` — 커스텀 카드 필드 +- `label: boolean | { show }` - 카드 레이블, [`text`](#text-and-textarea-types) 타입으로 편집 +- `description: boolean | { show }` - 카드 설명, [`textarea`](#text-and-textarea-types) 타입으로 편집 +- `progress: boolean | { show }` - 카드 진행률, [`progress`](#progress-type) 타입으로 편집 +- `start_date: boolean | { show, format }` - 카드 시작일, [`date`](#date-and-daterange-types) 타입으로 편집 +- `end_date: boolean | { show, format }` - 카드 종료일, [`date`](#date-and-daterange-types) 타입으로 편집 +- `menu: boolean | { show, items }` - 카드 컨텍스트 메뉴 +- `attached: boolean | { show }` - 카드 첨부파일, [`files`](#files-type) 타입으로 편집 +- `color: boolean | { show, values }` - 카드 상단 색상 라인, [`color`](#color-type) 타입으로 편집 +- `cover: boolean | { show }` - 카드 미리보기 이미지 +- `comments: boolean | { show }` - 카드 댓글 +- `confirmDeletion: boolean | { show }` - 카드 삭제 확인 다이얼로그 +- `votes: boolean | { show, clickable }` - 카드 투표 +- `users: boolean | { show, values, maxCount }` - 카드에 할당된 사용자, [`combo`, `select`, 또는 `multiselect`](#combo-select-and-multiselect-types) 타입으로 편집 +- `priority: boolean | { show, values }` - 카드 우선순위, [`combo` 또는 `select`](#combo-select-and-multiselect-types) 타입으로 편집 +- `css: (card) => string` - 카드에 조건부로 적용할 CSS 클래스를 반환하는 함수 +- `headerFields: [{ key, label, css }]` - 커스텀 카드 필드 :::tip `cardShape`에서 필드를 활성화하면 에디터에 해당 컨트롤이 자동으로 표시됩니다. 각 컨트롤은 [`editorShape`](api/config/js_kanban_editorshape_config.md) 속성으로 설정할 수 있습니다. 사용 가능한 타입은 [에디터](#editor) 섹션을 참고하세요. @@ -98,14 +98,14 @@ new kanban.Kanban("#root", { Kanban 에디터는 카드 데이터 관리를 위한 필드로 구성됩니다. [`editorShape`](api/config/js_kanban_editorshape_config.md) 속성으로 에디터 필드를 설정할 수 있습니다. 사용 가능한 필드 타입은 다음과 같습니다: -- [`combo`, `select`, `multiselect`](#combo-select-and-multiselect-types) — 드롭다운 옵션 -- [`color`](#color-type) — 색상 선택기 -- [`text`, `textarea`](#text-and-textarea-types) — 텍스트 입력 -- [`progress`](#progress-type) — 진행률 슬라이더 -- [`files`](#files-type) — 파일 업로더 -- [`date`, `dateRange`](#date-and-daterange-types) — 단일 날짜 또는 날짜 범위 -- [`comments`](#comments-type) — 카드 댓글 -- [`links`](#links-type) — 카드 링크 +- [`combo`, `select`, `multiselect`](#combo-select-and-multiselect-types) - 드롭다운 옵션 +- [`color`](#color-type) - 색상 선택기 +- [`text`, `textarea`](#text-and-textarea-types) - 텍스트 입력 +- [`progress`](#progress-type) - 진행률 슬라이더 +- [`files`](#files-type) - 파일 업로더 +- [`date`, `dateRange`](#date-and-daterange-types) - 단일 날짜 또는 날짜 범위 +- [`comments`](#comments-type) - 카드 댓글 +- [`links`](#links-type) - 카드 링크 :::info [`editor.placement`](api/config/js_kanban_editor_config.md) 속성으로 에디터를 사이드바 또는 모달 창으로 표시할 수 있습니다. @@ -444,10 +444,10 @@ new kanban.Kanban("#root", { [`editor`](api/config/js_kanban_editor_config.md) 속성으로 에디터 표시 여부, 자동 저장, 배치를 제어할 수 있습니다: -- [`editor.show`](api/config/js_kanban_editor_config.md) — 에디터 활성화 또는 비활성화 -- [`editor.placement`](api/config/js_kanban_editor_config.md) — 에디터를 `"sidebar"` 또는 `"modal"` 창으로 표시 -- [`editor.autoSave`](api/config/js_kanban_editor_config.md) — 자동 저장 모드 활성화 또는 비활성화 -- [`editor.debounce`](api/config/js_kanban_editor_config.md) — 자동 저장 전 지연 시간(`autoSave: true`에서만 적용) +- [`editor.show`](api/config/js_kanban_editor_config.md) - 에디터 활성화 또는 비활성화 +- [`editor.placement`](api/config/js_kanban_editor_config.md) - 에디터를 `"sidebar"` 또는 `"modal"` 창으로 표시 +- [`editor.autoSave`](api/config/js_kanban_editor_config.md) - 자동 저장 모드 활성화 또는 비활성화 +- [`editor.debounce`](api/config/js_kanban_editor_config.md) - 자동 저장 전 지연 시간(`autoSave: true`에서만 적용) 다음 코드 스니펫은 2초 지연 자동 저장을 활성화합니다: @@ -469,8 +469,8 @@ new kanban.Kanban("#root", { Kanban 위젯은 기본적으로 모든 카드를 렌더링하고 전체 보드를 스크롤합니다. 카드가 많은 보드의 경우 지연 렌더링 또는 컬럼별 스크롤로 전환할 수 있습니다: -- [`renderType`](api/config/js_kanban_rendertype_config.md) — `"lazy"`로 설정하면 보드에 보이는 카드만 렌더링 -- [`scrollType`](api/config/js_kanban_scrolltype_config.md) — `"column"`으로 설정하면 각 컬럼을 독립적으로 스크롤 +- [`renderType`](api/config/js_kanban_rendertype_config.md) - `"lazy"`로 설정하면 보드에 보이는 카드만 렌더링 +- [`scrollType`](api/config/js_kanban_scrolltype_config.md) - `"column"`으로 설정하면 각 컬럼을 독립적으로 스크롤 다음 코드 스니펫은 지연 렌더링과 컬럼별 스크롤을 활성화합니다: diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/customization.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/customization.md index 5052bad..1374d91 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/customization.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/customization.md @@ -8,12 +8,12 @@ description: DHTMLX Kanban 사용자 정의 가이드를 활용하여 문서화 다음 속성을 사용하여 Kanban의 외관과 동작을 사용자 정의할 수 있습니다: -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — 사용자 정의 HTML 템플릿으로 카드를 렌더링합니다 -- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) — 카드, 컬럼, 행의 컨텍스트 메뉴를 수정합니다 -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — 컬럼 헤더 템플릿을 교체합니다 -- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) — 조건부로 CSS 클래스를 적용합니다 -- [`items`](api/config/toolbar_items_config.md) — Toolbar 구조를 재배치하고 사용자 정의 컨트롤을 추가합니다 -- CSS 변수 — 시각적 스타일을 조정합니다([Stylization](guides/stylization.md) 섹션 참고) +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - 사용자 정의 HTML 템플릿으로 카드를 렌더링합니다 +- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) - 카드, 컬럼, 행의 컨텍스트 메뉴를 수정합니다 +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - 컬럼 헤더 템플릿을 교체합니다 +- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) - 조건부로 CSS 클래스를 적용합니다 +- [`items`](api/config/toolbar_items_config.md) - Toolbar 구조를 재배치하고 사용자 정의 컨트롤을 추가합니다 +- CSS 변수 - 시각적 스타일을 조정합니다([Stylization](guides/stylization.md) 섹션 참고) ## 사용자 정의 카드 {#custom-cards} @@ -21,10 +21,10 @@ description: DHTMLX Kanban 사용자 정의 가이드를 활용하여 문서화 콜백 함수는 다음 매개변수를 가진 객체를 받습니다: -- `cardFields` — 카드 데이터 -- `selected` — 카드 선택 여부 -- `dragging` — 카드 드래그 중 여부 -- `cardShape` — 카드 설정 +- `cardFields` - 카드 데이터 +- `selected` - 카드 선택 여부 +- `dragging` - 카드 드래그 중 여부 +- `cardShape` - 카드 설정 사용자 정의 카드 템플릿에 컨텍스트 메뉴 트리거를 포함하려면, 메뉴 아이콘을 `data-menu-id=${cardFields.id}` 속성을 가진 `
`로 감싸세요(기본 제공 카드와 동일한 구조). 위젯은 이 속성을 통해 래퍼에 메뉴를 바인딩합니다. @@ -40,21 +40,21 @@ description: DHTMLX Kanban 사용자 정의 가이드를 활용하여 문서화 기본적으로 카드 메뉴에는 **복제** 및 **삭제** 옵션이 표시됩니다. 사용 가능한 기본 제공 액션 ID: -- `"duplicate-card"` — 카드 복제 -- `"delete-card"` — 카드 삭제 +- `"duplicate-card"` - 카드 복제 +- `"delete-card"` - 카드 삭제 ### `columnShape.menu` -- `"add-card"` — 컬럼에 새 카드 추가 -- `"set-edit"` — 컬럼 이름 변경 -- `"move-column:left"`, `"move-column:right"` — 컬럼을 왼쪽 또는 오른쪽으로 이동 -- `"delete-column"` — 컬럼 삭제 +- `"add-card"` - 컬럼에 새 카드 추가 +- `"set-edit"` - 컬럼 이름 변경 +- `"move-column:left"`, `"move-column:right"` - 컬럼을 왼쪽 또는 오른쪽으로 이동 +- `"delete-column"` - 컬럼 삭제 ### `rowShape.menu` -- `"set-edit"` — 행 이름 변경 -- `"move-row:up"`, `"move-row:down"` — 행을 위 또는 아래로 이동 -- `"delete-row"` — 행 삭제 +- `"set-edit"` - 행 이름 변경 +- `"move-row:up"`, `"move-row:down"` - 행을 위 또는 아래로 이동 +- `"delete-row"` - 행 삭제 `menu.items`에 함수를 설정하면 카드, 컬럼, 행별로 다른 메뉴를 렌더링할 수 있습니다. 특정 항목에서 메뉴를 숨기려면 함수에서 `null` 또는 `false`를 반환하세요. @@ -66,9 +66,9 @@ description: DHTMLX Kanban 사용자 정의 가이드를 활용하여 문서화 [`columnShape`](api/config/js_kanban_columnshape_config.md) 속성은 컬럼 헤더에 대한 템플릿과 동작을 제공합니다: -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) — 확장 상태의 컬럼 헤더 HTML 템플릿 -- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — 축소 상태의 컬럼 헤더 HTML 템플릿 -- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) — 세로 스크롤 시 컬럼 헤더 고정(기본값: `true`) +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) - 확장 상태의 컬럼 헤더 HTML 템플릿 +- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - 축소 상태의 컬럼 헤더 HTML 템플릿 +- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) - 세로 스크롤 시 컬럼 헤더 고정(기본값: `true`) 다음 코드 예제는 접기 아이콘, 카드 수가 포함된 레이블, 메뉴 트리거를 가진 사용자 정의 헤더 템플릿을 설정합니다: @@ -103,9 +103,9 @@ new kanban.Kanban("#root", { CSS 클래스를 조건부로 적용하려면 [`cardShape`](api/config/js_kanban_cardshape_config.md), [`columnShape`](api/config/js_kanban_columnshape_config.md), [`rowShape`](api/config/js_kanban_rowshape_config.md)의 `css` 매개변수에 함수를 전달하세요. 함수는 현재 데이터를 기반으로 클래스 이름을 반환합니다: -- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) — 카드에 적용할 클래스 -- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) — 컬럼에 적용할 클래스 -- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) — 행에 적용할 클래스 +- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) - 카드에 적용할 클래스 +- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) - 컬럼에 적용할 클래스 +- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) - 행에 적용할 클래스 다음 코드 예제는 기한이 지난 카드와 카드 수가 적은 컬럼을 강조 표시합니다: diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/initialization.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/initialization.md index a77a31c..0efc93b 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/initialization.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/initialization.md @@ -81,8 +81,8 @@ Toolbar 구성에 대한 자세한 내용은 [Configuration](guides/configuratio 전체 설정 레퍼런스는 다음을 참고하세요. -- [Kanban properties overview](api/overview/properties_overview.md) — 전체 Kanban 설정 속성 -- [Toolbar properties overview](api/overview/toolbar_properties_overview.md) — 전체 Toolbar 설정 속성 +- [Kanban properties overview](api/overview/properties_overview.md) - 전체 Kanban 설정 속성 +- [Toolbar properties overview](api/overview/toolbar_properties_overview.md) - 전체 Toolbar 설정 속성 ## 예제 diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md index bc3b3ef..1164de6 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md @@ -20,8 +20,8 @@ DHTMLX Kanban은 Svelte와 호환됩니다. 전체 코드 예제는 [GitHub](htt Svelte 프로젝트를 만드는 방법은 두 가지입니다: -- [SvelteKit](https://kit.svelte.dev/) 사용 — 권장 -- Svelte와 Vite 사용(SvelteKit 없이) — 다음 명령어를 실행합니다: +- [SvelteKit](https://kit.svelte.dev/) 사용 - 권장 +- Svelte와 Vite 사용(SvelteKit 없이) - 다음 명령어를 실행합니다: ~~~json npm create vite@latest diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/localization.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/localization.md index 64afd06..87db2d1 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/localization.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/localization.md @@ -144,11 +144,11 @@ const en = { 로케일 객체는 다섯 개의 최상위 섹션으로 구성됩니다: -- `lang` — 언어 코드 (예: `"en-US"`) -- `kanban` — UI 라벨 (버튼, 다이얼로그, 검색, 정렬 옵션, 링크 관계) -- `calendar` — 날짜 선택기 라벨 및 설정 (월·요일 이름, 시계 형식, 주 시작일, AM/PM 마커) -- `formats` — 날짜 및 시간 형식 패턴 (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) -- `core` — 공유 다이얼로그 버튼 (`ok`, `cancel`) +- `lang` - 언어 코드 (예: `"en-US"`) +- `kanban` - UI 라벨 (버튼, 다이얼로그, 검색, 정렬 옵션, 링크 관계) +- `calendar` - 날짜 선택기 라벨 및 설정 (월·요일 이름, 시계 형식, 주 시작일, AM/PM 마커) +- `formats` - 날짜 및 시간 형식 패턴 (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) +- `core` - 공유 다이얼로그 버튼 (`ok`, `cancel`) 로케일 객체에는 Kanban과 Toolbar의 모든 라벨에 대한 번역이 포함되어야 합니다. @@ -156,15 +156,15 @@ const en = { Kanban은 다음과 같은 내장 로케일을 내보냅니다: -- `"en"` — 영어 -- `"de"` — 독일어 -- `"cn"` — 중국어 -- `"es"` — 스페인어 -- `"fr"` — 프랑스어 -- `"it"` — 이탈리아어 -- `"jp"` — 일본어 -- `"pt"` — 포르투갈어 -- `"ru"` — 러시아어 +- `"en"` - 영어 +- `"de"` - 독일어 +- `"cn"` - 중국어 +- `"es"` - 스페인어 +- `"fr"` - 프랑스어 +- `"it"` - 이탈리아어 +- `"jp"` - 일본어 +- `"pt"` - 포르투갈어 +- `"ru"` - 러시아어 로케일은 `kanban.locales[""]`를 통해 접근할 수 있습니다. Toolbar는 별도의 컴포넌트이므로 로케일을 Toolbar에 독립적으로 적용해야 합니다. 다음 코드 스니펫은 초기화 시 Kanban과 Toolbar 모두에 `"cn"` 로케일을 적용합니다: diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/stylization.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/stylization.md index c8115ed..f1ddfd5 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/stylization.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/stylization.md @@ -8,8 +8,8 @@ description: DHTMLX Kanban 스타일링 가이드를 확인하세요. CSS 클래 CSS 클래스와 CSS 변수를 통해 Kanban의 외관을 스타일링할 수 있습니다. 다음 속성들은 컬럼, 행, 카드에 대한 CSS 클래스를 허용합니다: -- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) — 아이템 데이터를 기반으로 조건부로 CSS 클래스를 반환하는 함수 -- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) — 단일 아이템에 할당되는 문자열 CSS 클래스 +- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) - 아이템 데이터를 기반으로 조건부로 CSS 클래스를 반환하는 함수 +- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) - 단일 아이템에 할당되는 문자열 CSS 클래스 조건부 `css` 함수의 자세한 내용과 코드 예제는 [조건부 CSS 클래스](guides/customization.md#conditional-css-classes)를 참조하세요. @@ -32,8 +32,8 @@ const cards = [ 아이템별 CSS 외에도 Kanban은 테마 설정을 위한 CSS 변수를 제공합니다. 변수는 두 그룹으로 나뉩니다: -- Kanban 변수 — Kanban 전용 스타일 정의 -- WX 라이브러리 변수 — 공유 UI 요소 스타일 (*컨트롤, 캘린더 등*) +- Kanban 변수 - Kanban 전용 스타일 정의 +- WX 라이브러리 변수 - 공유 UI 요소 스타일 (*컨트롤, 캘린더 등*) :::info WX 라이브러리는 Kanban 내부 UI 컴포넌트를 구동합니다. WX 변수는 Kanban 스타일링의 일부로 취급하세요. diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_data.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_data.md index f981cd4..a600e05 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_data.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_data.md @@ -146,62 +146,62 @@ board.setConfig({ columns, cards, rows }); ## 데이터 가져오기 -- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) — 지정한 컬럼(및 선택적으로 행)의 모든 카드 데이터 객체를 반환합니다 -- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) — 지정한 컬럼의 모든 카드 데이터 객체를 반환합니다 -- [`getCard()`](api/methods/js_kanban_getcard_method.md) — ID로 카드 데이터 객체를 반환합니다 -- [`serialize()`](api/methods/js_kanban_serialize_method.md) — Kanban 데이터를 JSON 객체로 반환합니다 +- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) - 지정한 컬럼(및 선택적으로 행)의 모든 카드 데이터 객체를 반환합니다 +- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) - 지정한 컬럼의 모든 카드 데이터 객체를 반환합니다 +- [`getCard()`](api/methods/js_kanban_getcard_method.md) - ID로 카드 데이터 객체를 반환합니다 +- [`serialize()`](api/methods/js_kanban_serialize_method.md) - Kanban 데이터를 JSON 객체로 반환합니다 ## 상태 가져오기 -- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) — *DataStore*의 반응형 속성을 반환합니다 -- [`api.getState()`](api/internal/js_kanban_getstate_method.md) — *DataStore*의 현재 속성을 반환합니다 -- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) — `{ data: DataStore }`를 반환합니다 +- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) - *DataStore*의 반응형 속성을 반환합니다 +- [`api.getState()`](api/internal/js_kanban_getstate_method.md) - *DataStore*의 현재 속성을 반환합니다 +- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) - `{ data: DataStore }`를 반환합니다 ## 데이터 내보내기 -- [`export.json()`](api/internal/js_kanban_json_method.md) — Kanban 데이터를 JSON 파일로 다운로드합니다 +- [`export.json()`](api/internal/js_kanban_json_method.md) - Kanban 데이터를 JSON 파일로 다운로드합니다 ## 새 항목 추가 -- [`addCard()`](api/methods/js_kanban_addcard_method.md) — 새 카드를 추가합니다 -- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) — 새 컬럼을 추가합니다 -- [`addRow()`](api/methods/js_kanban_addrow_method.md) — 새 행을 추가합니다 -- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) — ID로 카드를 복제합니다 +- [`addCard()`](api/methods/js_kanban_addcard_method.md) - 새 카드를 추가합니다 +- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) - 새 컬럼을 추가합니다 +- [`addRow()`](api/methods/js_kanban_addrow_method.md) - 새 행을 추가합니다 +- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) - ID로 카드를 복제합니다 ## 항목 업데이트 -- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) — ID로 카드를 업데이트합니다 -- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) — ID로 컬럼을 업데이트합니다 -- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) — ID로 행을 업데이트합니다 +- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) - ID로 카드를 업데이트합니다 +- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) - ID로 컬럼을 업데이트합니다 +- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) - ID로 행을 업데이트합니다 ## 항목 삭제 -- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) — ID로 카드를 삭제합니다 -- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) — ID로 컬럼을 삭제합니다 -- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) — ID로 행을 삭제합니다 +- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) - ID로 카드를 삭제합니다 +- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) - ID로 컬럼을 삭제합니다 +- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) - ID로 행을 삭제합니다 ## 항목 이동 -- [`moveCard()`](api/methods/js_kanban_movecard_method.md) — 카드를 대상 컬럼과 행으로 이동합니다 -- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) — 컬럼을 새 위치로 이동합니다 -- [`moveRow()`](api/methods/js_kanban_moverow_method.md) — 행을 새 위치로 이동합니다 +- [`moveCard()`](api/methods/js_kanban_movecard_method.md) - 카드를 대상 컬럼과 행으로 이동합니다 +- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) - 컬럼을 새 위치로 이동합니다 +- [`moveRow()`](api/methods/js_kanban_moverow_method.md) - 행을 새 위치로 이동합니다 ## 댓글 관리 -- [`addComment()`](api/methods/js_kanban_addcomment_method.md) — ID로 카드에 댓글을 추가합니다 -- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) — ID로 댓글을 업데이트합니다 -- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) — ID로 댓글을 삭제합니다 +- [`addComment()`](api/methods/js_kanban_addcomment_method.md) - ID로 카드에 댓글을 추가합니다 +- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) - ID로 댓글을 업데이트합니다 +- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) - ID로 댓글을 삭제합니다 ## 링크 관리 -- [`addLink()`](api/methods/js_kanban_addlink_method.md) — 카드 간에 새 링크를 추가합니다 -- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) — ID로 링크를 삭제합니다 +- [`addLink()`](api/methods/js_kanban_addlink_method.md) - 카드 간에 새 링크를 추가합니다 +- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) - ID로 링크를 삭제합니다 ## 카드 선택 관리 -- [`getSelection()`](api/methods/js_kanban_getselection_method.md) — 현재 선택된 카드의 ID를 반환합니다 -- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) — ID로 카드를 선택합니다 -- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) — ID로 카드 선택을 해제합니다 +- [`getSelection()`](api/methods/js_kanban_getselection_method.md) - 현재 선택된 카드의 ID를 반환합니다 +- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) - ID로 카드를 선택합니다 +- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) - ID로 카드 선택을 해제합니다 ## 예제 diff --git a/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_server.md b/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_server.md index f276278..cec6f71 100644 --- a/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_server.md +++ b/i18n/ko/docusaurus-plugin-content-docs/current/guides/working_with_server.md @@ -40,20 +40,20 @@ JavaScript Kanban에는 백엔드와의 통신을 위한 REST API를 완벽하 `RestDataProvider` 서비스는 다음과 같은 REST 메서드를 제공합니다: -- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) — ***카드 데이터***에 대한 promise를 반환합니다 -- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) — ***컬럼 데이터***에 대한 promise를 반환합니다 -- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) — provider가 사용하는 기본 액션 핸들러를 반환합니다 -- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) — 임시 클라이언트 ID를 백엔드 ID로 변환하는 함수를 반환합니다 -- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) — ***링크 데이터***에 대한 promise를 반환합니다 -- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) — provider가 처리하는 액션의 내부 큐를 반환합니다 -- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) — ***행 데이터***에 대한 promise를 반환합니다 -- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) — ***사용자 데이터***에 대한 promise를 반환합니다 -- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) — 커스텀 HTTP 요청을 전송하고 promise를 반환합니다 -- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) — 모든 요청에 첨부할 커스텀 HTTP 헤더를 설정합니다 +- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) - ***카드 데이터***에 대한 promise를 반환합니다 +- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) - ***컬럼 데이터***에 대한 promise를 반환합니다 +- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) - provider가 사용하는 기본 액션 핸들러를 반환합니다 +- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) - 임시 클라이언트 ID를 백엔드 ID로 변환하는 함수를 반환합니다 +- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) - ***링크 데이터***에 대한 promise를 반환합니다 +- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) - provider가 처리하는 액션의 내부 큐를 반환합니다 +- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) - ***행 데이터***에 대한 promise를 반환합니다 +- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) - ***사용자 데이터***에 대한 promise를 반환합니다 +- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) - 커스텀 HTTP 요청을 전송하고 promise를 반환합니다 +- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) - 모든 요청에 첨부할 커스텀 HTTP 헤더를 설정합니다 ## RestDataProvider 커스터마이징 -`RestDataProvider`가 서버에 데이터 작업을 전송하는 방식을 커스터마이징하려면, 클래스를 확장하고 메서드를 오버라이드하세요. 대부분의 경우, 커스터마이징은 기본 액션 핸들러를 대상으로 합니다 — 예를 들어, 커스텀 이벤트에 대한 핸들러를 추가하거나 기존 작업의 payload를 확장하는 경우입니다. +`RestDataProvider`가 서버에 데이터 작업을 전송하는 방식을 커스터마이징하려면, 클래스를 확장하고 메서드를 오버라이드하세요. 대부분의 경우, 커스터마이징은 기본 액션 핸들러를 대상으로 합니다. 예를 들어, 커스텀 이벤트에 대한 핸들러를 추가하거나 기존 작업의 payload를 확장하는 경우입니다. 기본 핸들러를 유지하면서 커스텀 핸들러를 추가하려면, [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md)를 오버라이드하고 `super.getHandlers()`의 결과 위에 커스텀 항목을 병합하세요: @@ -75,7 +75,7 @@ board.api.setNext(restProvider); ~~~ :::warning -오버라이드에서는 항상 `super.getHandlers()`를 호출하고 그 결과를 spread하세요. 기본 핸들러를 오버라이드에 직접 복사하지 마세요 — 액션 맵은 버전마다 변경될 수 있으므로, 하드코딩된 복사본은 현재 기본값과 조용히 동기화가 깨질 수 있습니다. +오버라이드에서는 항상 `super.getHandlers()`를 호출하고 그 결과를 spread하세요. 기본 핸들러를 오버라이드에 직접 복사하지 마세요. 액션 맵은 버전마다 변경될 수 있으므로, 하드코딩된 복사본은 현재 기본값과 조용히 동기화가 깨질 수 있습니다. ::: 또 다른 일반적인 커스터마이징 대상은 [`send()`](api/provider/rest_methods/js_kanban_send_method.md) 메서드입니다. 이 메서드는 모든 기본 핸들러에서 호출됩니다. `send()`를 오버라이드하면 추가 헤더를 주입하거나, URL을 재작성하거나, 모든 서버 요청에 커스텀 로직을 적용할 수 있습니다. @@ -218,8 +218,8 @@ events.on(handlers); 스니펫에서 사용된 식별자: -- `handlers` — 서버 이벤트를 처리하는 클라이언트 핸들러 -- `events` — 서버에서 수신되는 이벤트를 수신하는 `RemoteEvents` 인스턴스 +- `handlers` - 서버 이벤트를 처리하는 클라이언트 핸들러 +- `events` - 서버에서 수신되는 이벤트를 수신하는 `RemoteEvents` 인스턴스 `events.on(handlers)` 호출은 서버 사이드 이벤트에 클라이언트 핸들러를 등록합니다. 이제 위젯은 서버 사이드 변경 사항을 실시간으로 반영합니다. @@ -295,11 +295,11 @@ remoteEvents.on(handlers); `type` 인자는 모델 유형을 식별합니다: -- `CardID` — `1` -- `RowID` — `2` -- `ColumnID` — `3` -- `LinkID` — `4` -- `CommentID` — `5` +- `CardID` - `1` +- `RowID` - `2` +- `ColumnID` - `3` +- `LinkID` - `4` +- `CommentID` - `5` `board.api.exec()`를 호출할 때 `skipProvider: true`를 전달하면 서버로의 요청 전송을 방지할 수 있습니다. `remoteEvents.on(handlers)` 호출로 커스텀 핸들러를 등록합니다. @@ -311,9 +311,9 @@ remoteEvents.on(handlers); 그룹화 규칙을 정의하세요. 아래 예제에서는 다음 상태를 사용합니다: -- `todo`, `unassigned` — **Open** 컬럼 -- `dev`, `testing` — **Inprogress** 컬럼 -- `merged`, `released` — **Done** 컬럼 +- `todo`, `unassigned` - **Open** 컬럼 +- `dev`, `testing` - **Inprogress** 컬럼 +- `merged`, `released` - **Done** 컬럼 구현 방법은 두 가지가 있습니다: diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md index 2f6a1f7..b553ec9 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md @@ -20,7 +20,7 @@ cardHeight?: number; // px Если вы используете настройки [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) и [`scrollType: "default"`](api/config/js_kanban_scrolltype_config.md) одновременно, не забудьте указать статическую высоту карточек через свойство `cardHeight`. Если не указать, карточки не будут отображаться. Если вы используете [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) с [`scrollType: "column"`](api/config/js_kanban_scrolltype_config.md), также рекомендуется зафиксировать высоту карточек через свойство `cardHeight`. Хотя для такого типа лейаута поддерживается переменная высота карточек, скролл может некорректно работать с кастомизациями карточек. -Если `cardHeight` не задан, виджет использует экспериментальное приближение высоты карточек на основе видимых полей, объявленных в [`cardShape`](api/config/js_kanban_cardshape_config.md). При использовании кастомного [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) это приближение не применяется — в таком случае либо задайте `cardHeight` явно, либо передайте кастомную функцию [`getCardHeight`](api/config/js_kanban_getcardheight_config.md). +Если `cardHeight` не задан, виджет использует экспериментальное приближение высоты карточек на основе видимых полей, объявленных в [`cardShape`](api/config/js_kanban_cardshape_config.md). При использовании кастомного [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) это приближение не применяется. В таком случае либо задайте `cardHeight` явно, либо передайте кастомную функцию [`getCardHeight`](api/config/js_kanban_getcardheight_config.md). ::: ### Пример diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md index 32cb310..f423842 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md @@ -13,7 +13,7 @@ description: Изучите API конфигурации getCardHeight для DH Функция `getCardHeight` используется виджетом для оценки высоты карточек, когда свойство [`cardHeight`](api/config/js_kanban_cardheight_config.md) не задано, а доска настроена с [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) и [`scrollType: "column"`](api/config/js_kanban_scrolltype_config.md). Расчётные высоты позволяют виджету корректно отрисовывать скроллбар до того, как фактические карточки измерены в DOM. :::info -Если вы задаёте свойство [`cardHeight`](api/config/js_kanban_cardheight_config.md), виджет использует фиксированную высоту и функция `getCardHeight` не вызывается. Задание `cardHeight` — рекомендуемый способ сочетания `renderType: "lazy"` с `scrollType: "column"`. +Если вы задаёте свойство [`cardHeight`](api/config/js_kanban_cardheight_config.md), виджет использует фиксированную высоту и функция `getCardHeight` не вызывается. Задавать `cardHeight` рекомендуется, если вы сочетаете `renderType: "lazy"` с `scrollType: "column"`. ::: ### Использование @@ -30,7 +30,7 @@ getCardHeight?: (cardShape: object, card: object, cardWidth: number) => number; - `card` - объект данных карточки - `cardWidth` - текущая ширина карточки в пикселях -Функция должна возвращать число — расчётную высоту карточки в пикселях. +Функция должна возвращать расчётную высоту карточки в пикселях. ### Конфигурация по умолчанию diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_gethandlers_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_gethandlers_method.md index d81ffb3..69047d1 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_gethandlers_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_gethandlers_method.md @@ -24,7 +24,7 @@ getHandlers(): object; Метод `getHandlers()` возвращает объект, который сопоставляет [операции с данными, поддерживаемые `RestDataProvider`](guides/working_with_server.md/#restdataprovider), с запросами, которые провайдер отправляет на сервер. -Возвращаемый объект — это карта действий по умолчанию, используемая внутри `RestDataProvider`. Переопределите этот метод, чтобы добавить собственные обработчики или заменить стандартные на пользовательскую логику. +Метод возвращает карту действий по умолчанию, которая используется внутри `RestDataProvider`. Переопределите этот метод, чтобы добавить собственные обработчики или заменить стандартные на пользовательскую логику. ### Пример diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md index 9a2c812..c6de82f 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md @@ -24,19 +24,19 @@ getIDResolver(): (id: string | number, type: number) => string | number; Метод возвращает функцию `idResolver(id, type)`: -- `id` — ID сущности для преобразования (временный клиентский ID или обычный ID) -- `type` — тип модели, которому принадлежит ID: - - `1` — карточка (`CardID`) - - `2` — строка (`RowID`) - - `3` — колонка (`ColumnID`) - - `4` — связь (`LinkID`) - - `5` — комментарий (`CommentID`) +- `id` - ID сущности для преобразования (временный клиентский ID или обычный ID) +- `type` - тип модели, которому принадлежит ID: + - `1` - карточка (`CardID`) + - `2` - строка (`RowID`) + - `3` - колонка (`ColumnID`) + - `4` - связь (`LinkID`) + - `5` - комментарий (`CommentID`) Когда клиент создаёт новую сущность (карточку, колонку, строку, связь, комментарий), `RestDataProvider` присваивает ей временный клиентский ID и запоминает серверный ID, возвращённый сервером. Функция `idResolver(id, type)` возвращает серверный ID для любого временного ID, который она хранит. Для ID, уже совпадающих с серверными, функция возвращает их без изменений. ### Пример -Наиболее распространённый сценарий использования — подключение `RestDataProvider` к `kanbanUpdates` в многопользовательской конфигурации, чтобы серверные события, адресованные серверным ID, корректно применялись к сущностям, которые ещё существуют на клиенте под временными ID: +Чаще всего этот метод нужен при подключении `RestDataProvider` к `kanbanUpdates` в многопользовательской конфигурации, чтобы серверные события, адресованные серверным ID, корректно применялись к сущностям, которые ещё существуют на клиенте под временными ID: ~~~jsx {6-9} const url = "https://some_backend_url"; diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getqueue_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getqueue_method.md index e7061af..e02a88c 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getqueue_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getqueue_method.md @@ -27,7 +27,7 @@ getQueue(): object; - буферизацию действий до завершения текущих запросов - назначение временных клиентских идентификаторов вновь созданным сущностям и их замену идентификаторами с сервера после получения ответа -Очередь используется внутри другими методами `RestDataProvider`. Наиболее распространённое косвенное использование — через [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md), который построен на логике разрешения идентификаторов из очереди. +Очередь используется внутри другими методами `RestDataProvider`. Чаще всего очередь задействуется косвенно, через [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md), который построен на логике разрешения идентификаторов из очереди. Как правило, вызывать `getQueue()` напрямую не нужно. Используйте этот метод только в тех случаях, когда требуется детальный доступ к очереди (например, при реализации расширенной пользовательской синхронизации между клиентом и сервером). diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_setheaders_method.md b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_setheaders_method.md index 14f4804..53abf00 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_setheaders_method.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_setheaders_method.md @@ -22,11 +22,11 @@ setHeaders(headers: object): void; ### Параметры -- `headers` - (обязательный) объект, ключи которого являются именами заголовков, а значения — значениями заголовков. Заголовки добавляются к стандартному заголовку `Content-Type: application/json` при каждом запросе, отправляемом через [`send()`](api/provider/rest_methods/js_kanban_send_method.md). +- `headers` - (обязательный) объект, в котором ключи именуют заголовки, а значения задают их содержимое. Заголовки добавляются к стандартному заголовку `Content-Type: application/json` при каждом запросе, отправляемом через [`send()`](api/provider/rest_methods/js_kanban_send_method.md). ### Пример -Наиболее распространённый сценарий использования — добавление токена авторизации к каждому запросу: +Чаще всего метод используют, чтобы добавить токен авторизации к каждому запросу: ~~~jsx {4-6} const url = "https://some_backend_url"; diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/configuration.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/configuration.md index 5a15f94..d9a01e6 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/configuration.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/configuration.md @@ -8,38 +8,38 @@ description: Читайте руководство по конфигурации Вы можете настраивать внешний вид и функциональность Kanban с помощью следующих свойств: -- [`cardShape`](api/config/js_kanban_cardshape_config.md) — настройка внешнего вида карточек и встроенных полей -- [`editorShape`](api/config/js_kanban_editorshape_config.md) — определение полей редактора -- [`editor`](api/config/js_kanban_editor_config.md) — управление видимостью редактора, автосохранением и расположением -- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) — настройка рендеринга карточек и прокрутки доски -- [`history`](api/config/js_kanban_history_config.md) — управление историей операций с карточками -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — кастомизация внешнего вида карточек (см. раздел [Кастомизация](guides/customization.md)) -- [`locale`](api/config/js_kanban_locale_config.md) — применение локализации (см. раздел [Локализация](guides/localization.md)) -- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) — загрузка данных для карточек, колонок, строк и связей (см. раздел [Работа с данными](guides/working_with_data.md)) +- [`cardShape`](api/config/js_kanban_cardshape_config.md) - настройка внешнего вида карточек и встроенных полей +- [`editorShape`](api/config/js_kanban_editorshape_config.md) - определение полей редактора +- [`editor`](api/config/js_kanban_editor_config.md) - управление видимостью редактора, автосохранением и расположением +- [`renderType`](api/config/js_kanban_rendertype_config.md), [`scrollType`](api/config/js_kanban_scrolltype_config.md) - настройка рендеринга карточек и прокрутки доски +- [`history`](api/config/js_kanban_history_config.md) - управление историей операций с карточками +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - кастомизация внешнего вида карточек (см. раздел [Кастомизация](guides/customization.md)) +- [`locale`](api/config/js_kanban_locale_config.md) - применение локализации (см. раздел [Локализация](guides/localization.md)) +- [`cards`](api/config/js_kanban_cards_config.md), [`columns`](api/config/js_kanban_columns_config.md), [`rows`](api/config/js_kanban_rows_config.md), [`links`](api/config/js_kanban_links_config.md) - загрузка данных для карточек, колонок, строк и связей (см. раздел [Работа с данными](guides/working_with_data.md)) ## Карточки {#cards} Доска Kanban состоит из карточек, распределённых по колонкам и строкам. Используйте свойство [`cardShape`](api/config/js_kanban_cardshape_config.md) для настройки внешнего вида карточек и встроенных полей: -- `label: boolean | { show }` — метка карточки, редактируется с помощью типа [`text`](#типы-text-и-textarea) -- `description: boolean | { show }` — описание карточки, редактируется с помощью типа [`textarea`](#типы-text-и-textarea) -- `progress: boolean | { show }` — прогресс карточки, редактируется с помощью типа [`progress`](#тип-progress) -- `start_date: boolean | { show, format }` — дата начала карточки, редактируется с помощью типа [`date`](#типы-date-и-daterange) -- `end_date: boolean | { show, format }` — дата окончания карточки, редактируется с помощью типа [`date`](#типы-date-и-daterange) -- `menu: boolean | { show, items }` — контекстное меню карточки -- `attached: boolean | { show }` — вложения карточки, редактируются с помощью типа [`files`](#тип-files) -- `color: boolean | { show, values }` — верхняя цветная полоска карточки, редактируется с помощью типа [`color`](#тип-color) -- `cover: boolean | { show }` — превью-изображение карточки -- `comments: boolean | { show }` — комментарии к карточке -- `confirmDeletion: boolean | { show }` — диалог подтверждения удаления карточки -- `votes: boolean | { show, clickable }` — голосование по карточке -- `users: boolean | { show, values, maxCount }` — пользователи, назначенные на карточку, редактируются с помощью типов [`combo`, `select` или `multiselect`](#типы-combo-select-и-multiselect) -- `priority: boolean | { show, values }` — приоритет карточки, редактируется с помощью типа [`combo` или `select`](#типы-combo-select-и-multiselect) -- `css: (card) => string` — функция, возвращающая CSS-класс, применяемый к карточке по условию -- `headerFields: [{ key, label, css }]` — кастомные поля карточки +- `label: boolean | { show }` - метка карточки, редактируется с помощью типа [`text`](#типы-text-и-textarea) +- `description: boolean | { show }` - описание карточки, редактируется с помощью типа [`textarea`](#типы-text-и-textarea) +- `progress: boolean | { show }` - прогресс карточки, редактируется с помощью типа [`progress`](#тип-progress) +- `start_date: boolean | { show, format }` - дата начала карточки, редактируется с помощью типа [`date`](#типы-date-и-daterange) +- `end_date: boolean | { show, format }` - дата окончания карточки, редактируется с помощью типа [`date`](#типы-date-и-daterange) +- `menu: boolean | { show, items }` - контекстное меню карточки +- `attached: boolean | { show }` - вложения карточки, редактируются с помощью типа [`files`](#тип-files) +- `color: boolean | { show, values }` - верхняя цветная полоска карточки, редактируется с помощью типа [`color`](#тип-color) +- `cover: boolean | { show }` - превью-изображение карточки +- `comments: boolean | { show }` - комментарии к карточке +- `confirmDeletion: boolean | { show }` - диалог подтверждения удаления карточки +- `votes: boolean | { show, clickable }` - голосование по карточке +- `users: boolean | { show, values, maxCount }` - пользователи, назначенные на карточку, редактируются с помощью типов [`combo`, `select` или `multiselect`](#типы-combo-select-и-multiselect) +- `priority: boolean | { show, values }` - приоритет карточки, редактируется с помощью типа [`combo` или `select`](#типы-combo-select-и-multiselect) +- `css: (card) => string` - функция, возвращающая CSS-класс, применяемый к карточке по условию +- `headerFields: [{ key, label, css }]` - кастомные поля карточки :::tip -При активации поля в `cardShape` редактор автоматически отображает соответствующий контрол. Настройте каждый контрол через свойство [`editorShape`](api/config/js_kanban_editorshape_config.md) — доступные типы описаны в разделе [Редактор](#editor). +При активации поля в `cardShape` редактор автоматически отображает соответствующий контрол. Настройте каждый контрол через свойство [`editorShape`](api/config/js_kanban_editorshape_config.md). Доступные типы описаны в разделе [Редактор](#editor). ::: Следующий пример настраивает карточки с кастомными пользователями, приоритетами и кастомным полем заголовка: @@ -98,14 +98,14 @@ new kanban.Kanban("#root", { Редактор Kanban содержит поля для управления данными карточек. Используйте свойство [`editorShape`](api/config/js_kanban_editorshape_config.md) для настройки полей редактора. Доступны следующие типы полей: -- [`combo`, `select`, `multiselect`](#типы-combo-select-и-multiselect) — выпадающие списки -- [`color`](#тип-color) — выбор цвета -- [`text`, `textarea`](#типы-text-и-textarea) — текстовые поля -- [`progress`](#тип-progress) — слайдер прогресса -- [`files`](#тип-files) — загрузчик файлов -- [`date`, `dateRange`](#типы-date-и-daterange) — одиночная дата или диапазон дат -- [`comments`](#comments-type) — комментарии к карточке -- [`links`](#links-type) — связи карточки +- [`combo`, `select`, `multiselect`](#типы-combo-select-и-multiselect) - выпадающие списки +- [`color`](#тип-color) - выбор цвета +- [`text`, `textarea`](#типы-text-и-textarea) - текстовые поля +- [`progress`](#тип-progress) - слайдер прогресса +- [`files`](#тип-files) - загрузчик файлов +- [`date`, `dateRange`](#типы-date-и-daterange) - одиночная дата или диапазон дат +- [`comments`](#comments-type) - комментарии к карточке +- [`links`](#links-type) - связи карточки :::info Отображайте редактор как боковую панель или модальное окно с помощью свойства [`editor.placement`](api/config/js_kanban_editor_config.md). @@ -444,10 +444,10 @@ new kanban.Kanban("#root", { Свойство [`editor`](api/config/js_kanban_editor_config.md) управляет видимостью редактора, автосохранением и расположением: -- [`editor.show`](api/config/js_kanban_editor_config.md) — включить или отключить редактор -- [`editor.placement`](api/config/js_kanban_editor_config.md) — отображать редактор как `"sidebar"` или `"modal"` окно -- [`editor.autoSave`](api/config/js_kanban_editor_config.md) — включить или отключить режим автосохранения -- [`editor.debounce`](api/config/js_kanban_editor_config.md) — задержка перед автосохранением (применяется только с `autoSave: true`) +- [`editor.show`](api/config/js_kanban_editor_config.md) - включить или отключить редактор +- [`editor.placement`](api/config/js_kanban_editor_config.md) - отображать редактор как `"sidebar"` или `"modal"` окно +- [`editor.autoSave`](api/config/js_kanban_editor_config.md) - включить или отключить режим автосохранения +- [`editor.debounce`](api/config/js_kanban_editor_config.md) - задержка перед автосохранением (применяется только с `autoSave: true`) Следующий пример включает автосохранение с задержкой 2 секунды: @@ -469,8 +469,8 @@ new kanban.Kanban("#root", { По умолчанию виджет Kanban рендерит все карточки и прокручивает всю доску целиком. Для досок с большим количеством карточек переключитесь на ленивый рендеринг или прокрутку по колонкам: -- [`renderType`](api/config/js_kanban_rendertype_config.md) — установите значение `"lazy"` для рендеринга только видимых на доске карточек -- [`scrollType`](api/config/js_kanban_scrolltype_config.md) — установите значение `"column"` для независимой прокрутки каждой колонки +- [`renderType`](api/config/js_kanban_rendertype_config.md) - установите значение `"lazy"` для рендеринга только видимых на доске карточек +- [`scrollType`](api/config/js_kanban_scrolltype_config.md) - установите значение `"column"` для независимой прокрутки каждой колонки Следующий пример включает ленивый рендеринг и прокрутку по колонкам: @@ -488,7 +488,7 @@ new kanban.Kanban("#root", { :::important При совместном использовании `renderType: "lazy"` с любым `scrollType` задайте статическую высоту карточек через свойство [`cardHeight`](api/config/js_kanban_cardheight_config.md). Без `cardHeight` ленивый рендеринг не отображает карточки корректно. -Если `cardHeight` не указан при использовании `renderType: "lazy"` и `scrollType: "column"`, виджет применяет экспериментальное приближение высоты карточек на основе видимых полей в [`cardShape`](api/config/js_kanban_cardshape_config.md). Для досок с кастомным [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) виджет не может предсказать итоговую высоту — передайте кастомную функцию [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md), возвращающую ожидаемую высоту карточки. +Если `cardHeight` не указан при использовании `renderType: "lazy"` и `scrollType: "column"`, виджет применяет экспериментальное приближение высоты карточек на основе видимых полей в [`cardShape`](api/config/js_kanban_cardshape_config.md). Для досок с кастомным [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) виджет не может предсказать итоговую высоту. Передайте кастомную функцию [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md), возвращающую ожидаемую высоту карточки. ::: ## История изменений diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/customization.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/customization.md index 80f9a23..8ae768a 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/customization.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/customization.md @@ -8,12 +8,12 @@ description: Используйте руководства по кастомиз Вы можете кастомизировать внешний вид и поведение Kanban с помощью следующих свойств: -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — отображение карточек с помощью кастомного HTML-шаблона -- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) — изменение контекстного меню карточек, колонок и строк -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — замена шаблонов заголовков колонок -- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) — условное применение CSS-классов -- [`items`](api/config/toolbar_items_config.md) — изменение структуры Toolbar и добавление кастомных элементов управления -- CSS-переменные — настройка визуальных стилей (см. раздел [Стилизация](guides/stylization.md)) +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - отображение карточек с помощью кастомного HTML-шаблона +- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md), [`columnShape.menu`](api/config/js_kanban_columnshape_config.md), [`rowShape.menu`](api/config/js_kanban_rowshape_config.md) - изменение контекстного меню карточек, колонок и строк +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md), [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - замена шаблонов заголовков колонок +- [`cardShape.css`](api/config/js_kanban_cardshape_config.md), [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md) - условное применение CSS-классов +- [`items`](api/config/toolbar_items_config.md) - изменение структуры Toolbar и добавление кастомных элементов управления +- CSS-переменные - настройка визуальных стилей (см. раздел [Стилизация](guides/stylization.md)) ## Кастомные карточки {#custom-cards} @@ -21,10 +21,10 @@ description: Используйте руководства по кастомиз Колбэк принимает объект со следующими параметрами: -- `cardFields` — данные карточки -- `selected` — выбрана ли карточка -- `dragging` — перетаскивается ли карточка в данный момент -- `cardShape` — конфигурация карточки +- `cardFields` - данные карточки +- `selected` - выбрана ли карточка +- `dragging` - перетаскивается ли карточка в данный момент +- `cardShape` - конфигурация карточки Чтобы встроить элемент вызова контекстного меню в кастомный шаблон карточки, оберните иконку меню в `
` с атрибутом `data-menu-id=${cardFields.id}` (аналогично встроенной карточке). Виджет привязывает меню к обёртке через этот атрибут. @@ -40,21 +40,21 @@ description: Используйте руководства по кастомиз По умолчанию меню карточки содержит опции **Дублировать** и **Удалить**. Доступные встроенные идентификаторы действий: -- `"duplicate-card"` — дублировать карточку -- `"delete-card"` — удалить карточку +- `"duplicate-card"` - дублировать карточку +- `"delete-card"` - удалить карточку ### `columnShape.menu` -- `"add-card"` — добавить новую карточку в колонку -- `"set-edit"` — переименовать колонку -- `"move-column:left"`, `"move-column:right"` — переместить колонку влево или вправо -- `"delete-column"` — удалить колонку +- `"add-card"` - добавить новую карточку в колонку +- `"set-edit"` - переименовать колонку +- `"move-column:left"`, `"move-column:right"` - переместить колонку влево или вправо +- `"delete-column"` - удалить колонку ### `rowShape.menu` -- `"set-edit"` — переименовать строку -- `"move-row:up"`, `"move-row:down"` — переместить строку вверх или вниз -- `"delete-row"` — удалить строку +- `"set-edit"` - переименовать строку +- `"move-row:up"`, `"move-row:down"` - переместить строку вверх или вниз +- `"delete-row"` - удалить строку Задайте `menu.items` как функцию, чтобы отображать разное меню для каждой карточки, колонки или строки. Верните `null` или `false` из функции, чтобы скрыть меню для конкретного элемента. @@ -66,9 +66,9 @@ description: Используйте руководства по кастомиз Свойство [`columnShape`](api/config/js_kanban_columnshape_config.md) предоставляет шаблоны и настройки поведения заголовков колонок: -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) — HTML-шаблон заголовка колонки в развёрнутом состоянии -- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — HTML-шаблон заголовка колонки в свёрнутом состоянии -- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) — фиксация заголовков колонок при вертикальной прокрутке (по умолчанию: `true`) +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) - HTML-шаблон заголовка колонки в развёрнутом состоянии +- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - HTML-шаблон заголовка колонки в свёрнутом состоянии +- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) - фиксация заголовков колонок при вертикальной прокрутке (по умолчанию: `true`) Следующий фрагмент кода задаёт кастомный шаблон заголовка с иконкой сворачивания, подписью с количеством карточек и элементом вызова меню: @@ -96,16 +96,16 @@ new kanban.Kanban("#root", { ~~~ :::tip -Чтобы `fixedHeaders` вступил в силу, задайте фиксированную высоту контейнера Kanban — тогда доска будет прокручиваться по вертикали. +Чтобы `fixedHeaders` вступил в силу, задайте фиксированную высоту контейнера Kanban, тогда доска будет прокручиваться по вертикали. ::: ## Условные CSS-классы {#conditional-css-classes} Чтобы применять CSS-класс условно, передайте функцию в параметр `css` свойства [`cardShape`](api/config/js_kanban_cardshape_config.md), [`columnShape`](api/config/js_kanban_columnshape_config.md) или [`rowShape`](api/config/js_kanban_rowshape_config.md). Функция возвращает имя класса на основе текущих данных: -- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) — класс, применяемый к карточке -- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) — класс, применяемый к колонке -- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) — класс, применяемый к строке +- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) - класс, применяемый к карточке +- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) - класс, применяемый к колонке +- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) - класс, применяемый к строке Следующий фрагмент кода выделяет просроченные карточки и недозагруженные колонки: diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/initialization.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/initialization.md index 921d1d8..8b8515d 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/initialization.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/initialization.md @@ -81,8 +81,8 @@ new kanban.Toolbar("#toolbar", { Полный справочник конфигурации: -- [Обзор свойств Kanban](api/overview/properties_overview.md) — все конфигурационные свойства Kanban -- [Обзор свойств Toolbar](api/overview/toolbar_properties_overview.md) — все конфигурационные свойства Toolbar +- [Обзор свойств Kanban](api/overview/properties_overview.md) - все конфигурационные свойства Kanban +- [Обзор свойств Toolbar](api/overview/toolbar_properties_overview.md) - все конфигурационные свойства Toolbar ## Пример diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md index 7dfa8fd..22e612e 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md @@ -20,8 +20,8 @@ DHTMLX Kanban совместим с Svelte. Полный пример кода Проект на Svelte можно настроить одним из двух способов: -- с помощью [SvelteKit](https://kit.svelte.dev/) — рекомендуется -- с помощью Svelte и Vite (без SvelteKit) — выполните: +- с помощью [SvelteKit](https://kit.svelte.dev/) - рекомендуется +- с помощью Svelte и Vite (без SvelteKit) - выполните: ~~~json npm create vite@latest diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/localization.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/localization.md index 1f27a2d..a197386 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/localization.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/localization.md @@ -144,11 +144,11 @@ const en = { Объект локали содержит пять разделов верхнего уровня: -- `lang` — код языка (например, `"en-US"`) -- `kanban` — надписи интерфейса (кнопки, диалоги, поиск, параметры сортировки, типы связей) -- `calendar` — надписи и настройки выбора даты (названия месяцев и дней, формат часов, начало недели, маркеры AM/PM) -- `formats` — шаблоны форматов даты и времени (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) -- `core` — общие кнопки диалогов (`ok`, `cancel`) +- `lang` - код языка (например, `"en-US"`) +- `kanban` - надписи интерфейса (кнопки, диалоги, поиск, параметры сортировки, типы связей) +- `calendar` - надписи и настройки выбора даты (названия месяцев и дней, формат часов, начало недели, маркеры AM/PM) +- `formats` - шаблоны форматов даты и времени (`timeFormat`, `dateFormat`, `monthYearFormat`, `yearFormat`) +- `core` - общие кнопки диалогов (`ok`, `cancel`) Объект локали должен содержать переводы для всех надписей Kanban и Toolbar. @@ -156,15 +156,15 @@ const en = { Kanban экспортирует следующие встроенные локали: -- `"en"` — English -- `"de"` — German -- `"cn"` — Chinese -- `"es"` — Spanish -- `"fr"` — French -- `"it"` — Italian -- `"jp"` — Japanese -- `"pt"` — Portuguese -- `"ru"` — Russian +- `"en"` - English +- `"de"` - German +- `"cn"` - Chinese +- `"es"` - Spanish +- `"fr"` - French +- `"it"` - Italian +- `"jp"` - Japanese +- `"pt"` - Portuguese +- `"ru"` - Russian Доступ к локали осуществляется через `kanban.locales[""]`. Toolbar является отдельным компонентом, поэтому локаль нужно применять к нему независимо. Следующий фрагмент кода применяет локаль `"cn"` к Kanban и Toolbar при инициализации: diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/mcp-server.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/mcp-server.md index addc5e4..654e00e 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/mcp-server.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/mcp-server.md @@ -1,14 +1,14 @@ --- sidebar_label: MCP-сервер DHTMLX title: Интеграция DHTMLX Kanban с MCP для досок и REST-синхронизации -description: MCP-сервер даёт AI-инструментам доступ к актуальной документации DHTMLX Kanban — карточки, колонки, строки, поля редактора и REST-синхронизация данных. +description: MCP-сервер даёт AI-инструментам доступ к актуальной документации DHTMLX Kanban по карточкам, колонкам, строкам, полям редактора и REST-синхронизации данных. --- # MCP-сервер DHTMLX Kanban: карточки, редактор и REST-синхронизация Рабочая доска [DHTMLX Kanban](/) складывается из нескольких частей, которые должны быть согласованы между собой: поля карточки и редактора [связываются общим ключом](guides/configuration.md#bind-editor-fields-to-card-fields), [Toolbar](guides/customization.md#custom-toolbar) работает как отдельный виджет, привязанный к доске, а [синхронизация с сервером](guides/working_with_server.md) опирается на конкретный набор обработчиков действий. Сгенерированный код оказывается рабочим тогда, когда в нём совпадают ключи полей карточки и редактора, Toolbar подключён отдельно, а синхронизация с сервером построена на сегодняшних обработчиках действий, а не на срезе из обучающей выборки. -MCP-сервер DHTMLX заставляет ассистента работать с актуальной документацией Kanban, а не строить догадки. Спросите про [привязку полей редактора к полям карточки](guides/configuration.md#bind-editor-fields-to-card-fields), [кастомизацию Toolbar](guides/customization.md#custom-toolbar) или [подключение backend через RestDataProvider](guides/working_with_server.md) — и ассистент подтянет актуальный справочник, прежде чем писать код. +MCP-сервер DHTMLX заставляет ассистента работать с актуальной документацией Kanban, а не строить догадки. Спросите про [привязку полей редактора к полям карточки](guides/configuration.md#bind-editor-fields-to-card-fields), [кастомизацию Toolbar](guides/customization.md#custom-toolbar) или [подключение backend через RestDataProvider](guides/working_with_server.md), и ассистент подтянет актуальный справочник, прежде чем писать код. ### MCP-эндпоинт @@ -24,7 +24,7 @@ MCP-сервер DHTMLX охватывает все основные проду Внутри сервер хранит полный индекс документации DHTMLX Kanban и готов обрабатывать запросы вроде таких: -- Поиск актуального API Kanban — [методы](api/overview/methods_overview.md), [события](api/overview/events_overview.md) и [свойства](api/overview/properties_overview.md), включая сигнатуры и значения по умолчанию. +- Поиск актуального API Kanban - [методы](api/overview/methods_overview.md), [события](api/overview/events_overview.md) и [свойства](api/overview/properties_overview.md), включая сигнатуры и значения по умолчанию. - Генерация готового к запуску кода [инициализации](guides/initialization.md) как для доски Kanban, так и для отдельного конструктора Toolbar. - Настройка [полей карточки и редактора](guides/configuration.md#cards) (`cardShape`, `editorShape`) и их связывание по ключу, включая типы полей combo, multiselect, color, date и files. - [Кастомизация](guides/customization.md) шаблонов карточек, контекстных меню и заголовков колонок через описанные в документации калбэки шаблонов. @@ -45,13 +45,13 @@ MCP-сервер DHTMLX отвечает на вопросы по Kanban чер 3. Поскольку ответ требует генерации кода, запрос уходит в *Search* (вопрос с одним правильным ответом вместо этого попал бы в *Inference*). 4. *Search* достаёт подходящие страницы из векторного индекса, построенного на актуальной документации Kanban. 5. Ассистент получает эти страницы обратно в качестве контекста. -6. На основе этого контекста ассистент настраивает `RestDataProvider` для операции `add-card`, а специфичные для вашего backend детали запроса дополняет из собственных знаний — вместо того чтобы гадать об API Kanban. +6. На основе этого контекста ассистент настраивает `RestDataProvider` для операции `add-card`, а специфичные для вашего backend детали запроса дополняет из собственных знаний, а не гадает об API Kanban. Предлагаемый код для Kanban остаётся согласованным с тем API, который работает сегодня. ## Регистрация MCP-сервера в разных инструментах -Через терминал или через файл конфигурации — в обоих случаях вы указываете инструменту приведённый ниже URL, и после регистрации сервер доступен для любой доски Kanban, которую вы собираете в этом инструменте. +И через терминал, и через файл конфигурации вы указываете инструменту приведённый ниже URL, и после регистрации сервер доступен для любой доски Kanban, которую вы собираете в этом инструменте. ~~~jsx https://docs.dhtmlx.com/mcp @@ -187,11 +187,11 @@ https://docs.dhtmlx.com/mcp ### Другие инструменты -Инструменты, для которых здесь нет отдельного раздела, обычно тоже поддерживают MCP — в настройках это чаще всего называется "Model Context Protocol" или "Context Sources". Добавьте туда `https://docs.dhtmlx.com/mcp` как пользовательский источник. +Инструменты, для которых здесь нет отдельного раздела, обычно тоже поддерживают MCP. В настройках это чаще всего называется "Model Context Protocol" или "Context Sources". Добавьте туда `https://docs.dhtmlx.com/mcp` как пользовательский источник. ## Что MCP-сервер делает с вашими данными -MCP-сервер — это размещённый на нашей стороне сервис: на вашей машине ничего не запускается, файлы вашего проекта не читаются, персональные данные не сохраняются. +MCP-сервер размещён на нашей стороне: на вашей машине ничего не запускается, файлы вашего проекта не читаются, персональные данные не сохраняются. При отладке и работе над улучшением сервиса запросы могут логироваться. @@ -249,6 +249,6 @@ MCP-сервер — это размещённый на нашей сторон ## Как получить более точные ответы по Kanban - **Называйте целевой элемент.** Различайте доску, колонку, строку (swimlane) и карточку (например, "на доске Kanban", "для конкретной строки", "на карточке в колонке Testing"). Точно названная цель помогает серверу подобрать нужные страницы справочника. -- **Указывайте тип поля.** `cardShape` и `editorShape` поддерживают множество типов полей (combo, multiselect, color, date, files). Называйте тип явно (например, "поле multiselect с аватарами") вместо просто "поле" — тогда ассистент подтянет подходящий раздел конфигурации. +- **Указывайте тип поля.** `cardShape` и `editorShape` поддерживают множество типов полей (combo, multiselect, color, date, files). Называйте тип явно (например, "поле multiselect с аватарами") вместо просто "поле", и тогда ассистент подтянет подходящий раздел конфигурации. - **Добавляйте "Используй документацию"** в запрос. Эта фраза подсказывает ассистенту, что нужно обратиться к MCP, а не отвечать только по данным обучения. Особенно это важно для обработчиков `RestDataProvider` и конфигурации полей, где API меняется чаще всего. -- **Уточняйте, где выполняется операция — на клиенте или на сервере.** Kanban работает как с локальными данными, так и с REST API через `RestDataProvider`. Укажите, что именно вам нужно (например, "через RestDataProvider" или "без backend"), чтобы ассистент не подмешивал специфичные для REST вызовы в клиентский пример. +- **Уточняйте, где выполняется операция: на клиенте или на сервере.** Kanban работает как с локальными данными, так и с REST API через `RestDataProvider`. Укажите, что именно вам нужно (например, "через RestDataProvider" или "без backend"), чтобы ассистент не подмешивал специфичные для REST вызовы в клиентский пример. diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/stylization.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/stylization.md index 2c74eb5..519867c 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/stylization.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/stylization.md @@ -8,8 +8,8 @@ description: Ознакомьтесь с руководством по стил Вы можете стилизовать внешний вид Kanban с помощью CSS-классов и CSS-переменных. Следующие свойства принимают CSS-классы для колонок, строк и карточек: -- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) — функции, возвращающие CSS-класс условно на основе данных элемента -- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) — строковый CSS-класс, применяемый к отдельному элементу +- [`columnShape.css`](api/config/js_kanban_columnshape_config.md), [`rowShape.css`](api/config/js_kanban_rowshape_config.md), [`cardShape.css`](api/config/js_kanban_cardshape_config.md) - функции, возвращающие CSS-класс условно на основе данных элемента +- [`columns.css`](api/config/js_kanban_columns_config.md), [`rows.css`](api/config/js_kanban_rows_config.md), [`cards.css`](api/config/js_kanban_cards_config.md) - строковый CSS-класс, применяемый к отдельному элементу Подробности и примеры кода для условных функций `css` см. в разделе [Условные CSS-классы](guides/customization.md#conditional-css-classes). @@ -32,8 +32,8 @@ const cards = [ Помимо CSS на уровне отдельных элементов, Kanban предоставляет CSS-переменные для тематизации. Переменные делятся на две группы: -- Переменные Kanban — определяют стили, специфичные для Kanban -- Переменные библиотеки WX — стилизуют общие элементы интерфейса (элементы управления, календари) +- Переменные Kanban - определяют стили, специфичные для Kanban +- Переменные библиотеки WX - стилизуют общие элементы интерфейса (элементы управления, календари) :::info Библиотека WX обеспечивает работу внутренних UI-компонентов Kanban. Рассматривайте переменные WX как часть стилизации Kanban. diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_data.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_data.md index 7595d6e..95e0967 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_data.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_data.md @@ -146,62 +146,62 @@ board.setConfig({ columns, cards, rows }); ## Получение данных -- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) — возвращает объекты данных всех cards в указанной column (и, опционально, row) -- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) — возвращает объекты данных всех cards в указанной column -- [`getCard()`](api/methods/js_kanban_getcard_method.md) — возвращает объект данных card по ID -- [`serialize()`](api/methods/js_kanban_serialize_method.md) — возвращает данные Kanban в виде JSON-объекта +- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) - возвращает объекты данных всех cards в указанной column (и, опционально, row) +- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) - возвращает объекты данных всех cards в указанной column +- [`getCard()`](api/methods/js_kanban_getcard_method.md) - возвращает объект данных card по ID +- [`serialize()`](api/methods/js_kanban_serialize_method.md) - возвращает данные Kanban в виде JSON-объекта ## Получение состояния -- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) — возвращает реактивные свойства *DataStore* -- [`api.getState()`](api/internal/js_kanban_getstate_method.md) — возвращает текущие свойства *DataStore* -- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) — возвращает `{ data: DataStore }` +- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) - возвращает реактивные свойства *DataStore* +- [`api.getState()`](api/internal/js_kanban_getstate_method.md) - возвращает текущие свойства *DataStore* +- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) - возвращает `{ data: DataStore }` ## Экспорт данных -- [`export.json()`](api/internal/js_kanban_json_method.md) — скачивает данные Kanban в виде JSON-файла +- [`export.json()`](api/internal/js_kanban_json_method.md) - скачивает данные Kanban в виде JSON-файла ## Добавление новых элементов -- [`addCard()`](api/methods/js_kanban_addcard_method.md) — добавляет новую card -- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) — добавляет новую column -- [`addRow()`](api/methods/js_kanban_addrow_method.md) — добавляет новую row -- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) — дублирует card по ID +- [`addCard()`](api/methods/js_kanban_addcard_method.md) - добавляет новую card +- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) - добавляет новую column +- [`addRow()`](api/methods/js_kanban_addrow_method.md) - добавляет новую row +- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) - дублирует card по ID ## Обновление элементов -- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) — обновляет card по ID -- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) — обновляет column по ID -- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) — обновляет row по ID +- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) - обновляет card по ID +- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) - обновляет column по ID +- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) - обновляет row по ID ## Удаление элементов -- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) — удаляет card по ID -- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) — удаляет column по ID -- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) — удаляет row по ID +- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) - удаляет card по ID +- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) - удаляет column по ID +- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) - удаляет row по ID ## Перемещение элементов -- [`moveCard()`](api/methods/js_kanban_movecard_method.md) — перемещает card в указанную column и row -- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) — перемещает column на новую позицию -- [`moveRow()`](api/methods/js_kanban_moverow_method.md) — перемещает row на новую позицию +- [`moveCard()`](api/methods/js_kanban_movecard_method.md) - перемещает card в указанную column и row +- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) - перемещает column на новую позицию +- [`moveRow()`](api/methods/js_kanban_moverow_method.md) - перемещает row на новую позицию ## Управление комментариями -- [`addComment()`](api/methods/js_kanban_addcomment_method.md) — добавляет комментарий к card по ID -- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) — обновляет комментарий по ID -- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) — удаляет комментарий по ID +- [`addComment()`](api/methods/js_kanban_addcomment_method.md) - добавляет комментарий к card по ID +- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) - обновляет комментарий по ID +- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) - удаляет комментарий по ID ## Управление links -- [`addLink()`](api/methods/js_kanban_addlink_method.md) — добавляет новый link между cards -- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) — удаляет link по ID +- [`addLink()`](api/methods/js_kanban_addlink_method.md) - добавляет новый link между cards +- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) - удаляет link по ID ## Управление выделением cards -- [`getSelection()`](api/methods/js_kanban_getselection_method.md) — возвращает ID выбранных в данный момент cards -- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) — выделяет card по ID -- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) — снимает выделение с card по ID +- [`getSelection()`](api/methods/js_kanban_getselection_method.md) - возвращает ID выбранных в данный момент cards +- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) - выделяет card по ID +- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) - снимает выделение с card по ID ## Пример diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_server.md b/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_server.md index 0306af1..16718aa 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_server.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/guides/working_with_server.md @@ -40,20 +40,20 @@ JavaScript Kanban поддерживает как клиентские, так Сервис `RestDataProvider` предоставляет следующие REST-методы: -- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) — возвращает promise с данными карточек -- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) — возвращает promise с данными колонок -- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) — возвращает стандартные обработчики действий, используемые провайдером -- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) — возвращает функцию, которая разрешает временные client ID в server ID -- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) — возвращает promise с данными связей -- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) — возвращает внутреннюю очередь действий, обрабатываемых провайдером -- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) — возвращает promise с данными строк -- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) — возвращает promise с данными пользователей -- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) — отправляет произвольный HTTP-запрос и возвращает promise -- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) — устанавливает пользовательские HTTP-заголовки, прикрепляемые к каждому запросу +- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) - возвращает promise с данными карточек +- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) - возвращает promise с данными колонок +- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) - возвращает стандартные обработчики действий, используемые провайдером +- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) - возвращает функцию, которая разрешает временные client ID в server ID +- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) - возвращает promise с данными связей +- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) - возвращает внутреннюю очередь действий, обрабатываемых провайдером +- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) - возвращает promise с данными строк +- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) - возвращает promise с данными пользователей +- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) - отправляет произвольный HTTP-запрос и возвращает promise +- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) - устанавливает пользовательские HTTP-заголовки, прикрепляемые к каждому запросу ## Кастомизация RestDataProvider -Чтобы изменить порядок отправки операций с данными на сервер, расширьте класс `RestDataProvider` и переопределите один из его методов. Чаще всего кастомизация направлена на стандартные обработчики действий — например, чтобы добавить обработчик для пользовательского события или расширить payload существующей операции. +Чтобы изменить порядок отправки операций с данными на сервер, расширьте класс `RestDataProvider` и переопределите один из его методов. Чаще всего кастомизация направлена на стандартные обработчики действий, например чтобы добавить обработчик для пользовательского события или расширить payload существующей операции. Чтобы добавить пользовательские обработчики без потери стандартных, переопределите [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) и объедините пользовательские записи поверх `super.getHandlers()`: @@ -75,10 +75,10 @@ board.api.setNext(restProvider); ~~~ :::warning -Всегда вызывайте `super.getHandlers()` в переопределении и разворачивайте его результат. Не копируйте стандартные обработчики вручную — карта действий может меняться между версиями, и жёстко заданная копия может незаметно рассинхронизироваться с актуальными значениями по умолчанию. +Всегда вызывайте `super.getHandlers()` в переопределении и разворачивайте его результат. Не копируйте стандартные обработчики вручную. Карта действий может меняться между версиями, и жёстко заданная копия может незаметно рассинхронизироваться с актуальными значениями по умолчанию. ::: -Ещё одна распространённая цель кастомизации — метод [`send()`](api/provider/rest_methods/js_kanban_send_method.md), который вызывается каждым стандартным обработчиком. Переопределите `send()`, чтобы добавить дополнительные заголовки, изменить URL или обернуть каждый запрос к серверу пользовательской логикой. +Часто кастомизируют и метод [`send()`](api/provider/rest_methods/js_kanban_send_method.md), который вызывается каждым стандартным обработчиком. Переопределите `send()`, чтобы добавить дополнительные заголовки, изменить URL или обернуть каждый запрос к серверу пользовательской логикой. ## Взаимодействие с backend @@ -218,8 +218,8 @@ events.on(handlers); В фрагменте используются следующие идентификаторы: -- `handlers` — клиентские обработчики для серверных событий -- `events` — экземпляр `RemoteEvents`, прослушивающий входящие события от сервера +- `handlers` - клиентские обработчики для серверных событий +- `events` - экземпляр `RemoteEvents`, прослушивающий входящие события от сервера Вызов `events.on(handlers)` регистрирует клиентские обработчики для серверных событий. Теперь виджет отражает изменения на стороне сервера в реальном времени. @@ -295,11 +295,11 @@ remoteEvents.on(handlers); Аргумент `type` определяет тип модели: -- `CardID` — `1` -- `RowID` — `2` -- `ColumnID` — `3` -- `LinkID` — `4` -- `CommentID` — `5` +- `CardID` - `1` +- `RowID` - `2` +- `ColumnID` - `3` +- `LinkID` - `4` +- `CommentID` - `5` Чтобы предотвратить отправку запроса на сервер, передайте `skipProvider: true` при вызове `board.api.exec()`. Вызов `remoteEvents.on(handlers)` регистрирует пользовательские обработчики. @@ -311,9 +311,9 @@ remoteEvents.on(handlers); Определите правила группировки. В примере ниже используются следующие статусы: -- `todo`, `unassigned` — для колонки **Open** -- `dev`, `testing` — для колонки **Inprogress** -- `merged`, `released` — для колонки **Done** +- `todo`, `unassigned` - для колонки **Open** +- `dev`, `testing` - для колонки **Inprogress** +- `merged`, `released` - для колонки **Done** Доступны два варианта реализации: diff --git a/i18n/ru/docusaurus-plugin-content-docs/current/news/whats_new.md b/i18n/ru/docusaurus-plugin-content-docs/current/news/whats_new.md index f17d91e..d73600a 100644 --- a/i18n/ru/docusaurus-plugin-content-docs/current/news/whats_new.md +++ b/i18n/ru/docusaurus-plugin-content-docs/current/news/whats_new.md @@ -444,8 +444,8 @@ description: Ознакомьтесь с новыми возможностями - Управление историей Kanban: - через элементы управления *Undo* и *Redo* на тулбаре - через сочетания клавиш: - - `Ctrl (Command)`+`Z` — отменить действие - - `Ctrl (Command)`+`Y` или `Ctrl (Command)`+`Shift`+`Z` — повторить действие + - `Ctrl (Command)`+`Z` - отменить действие + - `Ctrl (Command)`+`Y` или `Ctrl (Command)`+`Shift`+`Z` - повторить действие - через API ### Новый API diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md b/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md index 9b770d2..d53643c 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_cardheight_config.md @@ -20,7 +20,7 @@ cardHeight?: number; // px 如果您同时使用 [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) 和 [`scrollType: "default"`](api/config/js_kanban_scrolltype_config.md) 设置，请务必通过 `cardHeight` 属性指定卡片的固定高度。如果未指定，卡片将不会显示。 当您将 [`renderType: "lazy"`](api/config/js_kanban_rendertype_config.md) 与 [`scrollType: "column"`](api/config/js_kanban_scrolltype_config.md) 配合使用时，也应通过 `cardHeight` 属性固定卡片高度。尽管该布局类型支持卡片高度可变，但在自定义卡片内容时，可能无法稳定工作。 -如果未指定 `cardHeight`，组件将根据 [`cardShape`](api/config/js_kanban_cardshape_config.md) 中声明的可见字段，对卡片高度进行实验性估算作为回退方案。若使用了自定义 [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md)，此估算将不适用——在这种情况下，请显式设置 `cardHeight`，或提供自定义的 [`getCardHeight`](api/config/js_kanban_getcardheight_config.md) 函数。 +如果未指定 `cardHeight`，组件将根据 [`cardShape`](api/config/js_kanban_cardshape_config.md) 中声明的可见字段，对卡片高度进行实验性估算作为回退方案。若使用了自定义 [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md)，此估算将不适用。在这种情况下，请显式设置 `cardHeight`，或提供自定义的 [`getCardHeight`](api/config/js_kanban_getcardheight_config.md) 函数。 ::: ### 示例 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md b/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md index ae0358a..6a76cdc 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/api/config/js_kanban_getcardheight_config.md @@ -30,7 +30,7 @@ getCardHeight?: (cardShape: object, card: object, cardWidth: number) => number; - `card` - 卡片的数据对象 - `cardWidth` - 卡片当前宽度（像素） -该函数必须返回一个数字——卡片的估算高度（像素）。 +该函数必须返回卡片的估算高度（像素）。 ### 默认配置 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md b/i18n/zh/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md index a0b49f8..5ce594d 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/api/provider/rest_methods/js_kanban_getidresolver_method.md @@ -24,13 +24,13 @@ getIDResolver(): (id: string | number, type: number) => string | number; 该方法返回一个 `idResolver(id, type)` 函数： -- `id` — 需要解析的实体 ID（临时客户端 ID 或常规 ID） -- `type` — 该 ID 所属的模型类型： - - `1` — 卡片（`CardID`） - - `2` — 行（`RowID`） - - `3` — 列（`ColumnID`） - - `4` — 链接（`LinkID`） - - `5` — 评论（`CommentID`） +- `id` - 需要解析的实体 ID（临时客户端 ID 或常规 ID） +- `type` - 该 ID 所属的模型类型： + - `1` - 卡片（`CardID`） + - `2` - 行（`RowID`） + - `3` - 列（`ColumnID`） + - `4` - 链接（`LinkID`） + - `5` - 评论（`CommentID`） 当客户端创建新实体（卡片、列、行、链接、评论）时，`RestDataProvider` 会为其分配一个临时客户端 ID，并记录服务器返回的后端 ID。`idResolver(id, type)` 函数会为其持有的任何临时 ID 返回对应的后端 ID。对于已与后端匹配的 ID，该函数将原样返回。 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/configuration.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/configuration.md index 3161e1e..7191223 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/configuration.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/configuration.md @@ -8,38 +8,38 @@ description: 阅读 DHTMLX Kanban 配置指南。学习如何设置卡片、列 您可以通过以下属性配置 Kanban 的外观和功能： -- [`cardShape`](api/config/js_kanban_cardshape_config.md) — 设置卡片外观和内置字段 -- [`editorShape`](api/config/js_kanban_editorshape_config.md) — 定义编辑器字段 -- [`editor`](api/config/js_kanban_editor_config.md) — 控制编辑器的可见性、自动保存和位置 -- [`renderType`](api/config/js_kanban_rendertype_config.md)、[`scrollType`](api/config/js_kanban_scrolltype_config.md) — 调整卡片渲染和看板滚动 -- [`history`](api/config/js_kanban_history_config.md) — 管理卡片操作历史记录 -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — 自定义卡片外观（参见[自定义](guides/customization.md)章节） -- [`locale`](api/config/js_kanban_locale_config.md) — 应用本地化（参见[本地化](guides/localization.md)章节） -- [`cards`](api/config/js_kanban_cards_config.md)、[`columns`](api/config/js_kanban_columns_config.md)、[`rows`](api/config/js_kanban_rows_config.md)、[`links`](api/config/js_kanban_links_config.md) — 加载卡片、列、行和链接数据（参见[数据操作](guides/working_with_data.md)章节） +- [`cardShape`](api/config/js_kanban_cardshape_config.md) - 设置卡片外观和内置字段 +- [`editorShape`](api/config/js_kanban_editorshape_config.md) - 定义编辑器字段 +- [`editor`](api/config/js_kanban_editor_config.md) - 控制编辑器的可见性、自动保存和位置 +- [`renderType`](api/config/js_kanban_rendertype_config.md)、[`scrollType`](api/config/js_kanban_scrolltype_config.md) - 调整卡片渲染和看板滚动 +- [`history`](api/config/js_kanban_history_config.md) - 管理卡片操作历史记录 +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - 自定义卡片外观（参见[自定义](guides/customization.md)章节） +- [`locale`](api/config/js_kanban_locale_config.md) - 应用本地化（参见[本地化](guides/localization.md)章节） +- [`cards`](api/config/js_kanban_cards_config.md)、[`columns`](api/config/js_kanban_columns_config.md)、[`rows`](api/config/js_kanban_rows_config.md)、[`links`](api/config/js_kanban_links_config.md) - 加载卡片、列、行和链接数据（参见[数据操作](guides/working_with_data.md)章节） ## 卡片 {#cards} Kanban 看板由分布在列和行中的卡片组成。使用 [`cardShape`](api/config/js_kanban_cardshape_config.md) 属性配置卡片外观和内置字段： -- `label: boolean | { show }` — 卡片标题，通过 [`text`](#text-和-textarea-类型) 类型编辑 -- `description: boolean | { show }` — 卡片描述，通过 [`textarea`](#text-和-textarea-类型) 类型编辑 -- `progress: boolean | { show }` — 卡片进度，通过 [`progress`](#progress-类型) 类型编辑 -- `start_date: boolean | { show, format }` — 卡片开始日期，通过 [`date`](#date-和-daterange-类型) 类型编辑 -- `end_date: boolean | { show, format }` — 卡片结束日期，通过 [`date`](#date-和-daterange-类型) 类型编辑 -- `menu: boolean | { show, items }` — 卡片右键菜单 -- `attached: boolean | { show }` — 卡片附件，通过 [`files`](#files-类型) 类型编辑 -- `color: boolean | { show, values }` — 卡片顶部颜色线，通过 [`color`](#color-类型) 类型编辑 -- `cover: boolean | { show }` — 卡片预览图片 -- `comments: boolean | { show }` — 卡片评论 -- `confirmDeletion: boolean | { show }` — 删除卡片的确认对话框 -- `votes: boolean | { show, clickable }` — 卡片投票 -- `users: boolean | { show, values, maxCount }` — 分配给卡片的用户，通过 [`combo`、`select` 或 `multiselect`](#comboselect-和-multiselect-类型) 类型编辑 -- `priority: boolean | { show, values }` — 卡片优先级，通过 [`combo` 或 `select`](#comboselect-和-multiselect-类型) 类型编辑 -- `css: (card) => string` — 返回有条件应用于卡片的 CSS 类的函数 -- `headerFields: [{ key, label, css }]` — 自定义卡片字段 +- `label: boolean | { show }` - 卡片标题，通过 [`text`](#text-和-textarea-类型) 类型编辑 +- `description: boolean | { show }` - 卡片描述，通过 [`textarea`](#text-和-textarea-类型) 类型编辑 +- `progress: boolean | { show }` - 卡片进度，通过 [`progress`](#progress-类型) 类型编辑 +- `start_date: boolean | { show, format }` - 卡片开始日期，通过 [`date`](#date-和-daterange-类型) 类型编辑 +- `end_date: boolean | { show, format }` - 卡片结束日期，通过 [`date`](#date-和-daterange-类型) 类型编辑 +- `menu: boolean | { show, items }` - 卡片右键菜单 +- `attached: boolean | { show }` - 卡片附件，通过 [`files`](#files-类型) 类型编辑 +- `color: boolean | { show, values }` - 卡片顶部颜色线，通过 [`color`](#color-类型) 类型编辑 +- `cover: boolean | { show }` - 卡片预览图片 +- `comments: boolean | { show }` - 卡片评论 +- `confirmDeletion: boolean | { show }` - 删除卡片的确认对话框 +- `votes: boolean | { show, clickable }` - 卡片投票 +- `users: boolean | { show, values, maxCount }` - 分配给卡片的用户，通过 [`combo`、`select` 或 `multiselect`](#comboselect-和-multiselect-类型) 类型编辑 +- `priority: boolean | { show, values }` - 卡片优先级，通过 [`combo` 或 `select`](#comboselect-和-multiselect-类型) 类型编辑 +- `css: (card) => string` - 返回有条件应用于卡片的 CSS 类的函数 +- `headerFields: [{ key, label, css }]` - 自定义卡片字段 :::tip -在 `cardShape` 中激活某个字段后，编辑器会自动显示对应的控件。通过 [`editorShape`](api/config/js_kanban_editorshape_config.md) 属性配置各个控件——可用类型详见[编辑器](#editor)章节。 +在 `cardShape` 中激活某个字段后，编辑器会自动显示对应的控件。通过 [`editorShape`](api/config/js_kanban_editorshape_config.md) 属性配置各个控件。可用类型详见[编辑器](#editor)章节。 ::: 以下代码片段配置了带有自定义用户、优先级和自定义标题字段的卡片： @@ -98,14 +98,14 @@ new kanban.Kanban("#root", { Kanban 编辑器包含用于管理卡片数据的字段。使用 [`editorShape`](api/config/js_kanban_editorshape_config.md) 属性配置编辑器字段。可用的字段类型如下： -- [`combo`、`select`、`multiselect`](#comboselect-和-multiselect-类型) — 下拉选项 -- [`color`](#color-类型) — 颜色选择器 -- [`text`、`textarea`](#text-和-textarea-类型) — 文本输入框 -- [`progress`](#progress-类型) — 进度滑块 -- [`files`](#files-类型) — 文件上传 -- [`date`、`dateRange`](#date-和-daterange-类型) — 单个日期或日期范围 -- [`comments`](#comments-type) — 卡片评论 -- [`links`](#links-type) — 卡片链接 +- [`combo`、`select`、`multiselect`](#comboselect-和-multiselect-类型) - 下拉选项 +- [`color`](#color-类型) - 颜色选择器 +- [`text`、`textarea`](#text-和-textarea-类型) - 文本输入框 +- [`progress`](#progress-类型) - 进度滑块 +- [`files`](#files-类型) - 文件上传 +- [`date`、`dateRange`](#date-和-daterange-类型) - 单个日期或日期范围 +- [`comments`](#comments-type) - 卡片评论 +- [`links`](#links-type) - 卡片链接 :::info 通过 [`editor.placement`](api/config/js_kanban_editor_config.md) 属性将编辑器显示为侧边栏或模态窗口。 @@ -444,10 +444,10 @@ new kanban.Kanban("#root", { [`editor`](api/config/js_kanban_editor_config.md) 属性控制编辑器的可见性、自动保存和位置： -- [`editor.show`](api/config/js_kanban_editor_config.md) — 启用或禁用编辑器 -- [`editor.placement`](api/config/js_kanban_editor_config.md) — 将编辑器显示为 `"sidebar"` 或 `"modal"` 窗口 -- [`editor.autoSave`](api/config/js_kanban_editor_config.md) — 启用或禁用自动保存模式 -- [`editor.debounce`](api/config/js_kanban_editor_config.md) — 自动保存前的延迟时间（仅在 `autoSave: true` 时生效） +- [`editor.show`](api/config/js_kanban_editor_config.md) - 启用或禁用编辑器 +- [`editor.placement`](api/config/js_kanban_editor_config.md) - 将编辑器显示为 `"sidebar"` 或 `"modal"` 窗口 +- [`editor.autoSave`](api/config/js_kanban_editor_config.md) - 启用或禁用自动保存模式 +- [`editor.debounce`](api/config/js_kanban_editor_config.md) - 自动保存前的延迟时间（仅在 `autoSave: true` 时生效） 以下代码片段启用自动保存并设置 2 秒延迟： @@ -469,8 +469,8 @@ new kanban.Kanban("#root", { Kanban 控件默认渲染所有卡片并整体滚动看板。对于卡片数量较多的看板，可切换为懒加载渲染或按列独立滚动： -- [`renderType`](api/config/js_kanban_rendertype_config.md) — 设为 `"lazy"` 仅渲染看板上可见的卡片 -- [`scrollType`](api/config/js_kanban_scrolltype_config.md) — 设为 `"column"` 使每列独立滚动 +- [`renderType`](api/config/js_kanban_rendertype_config.md) - 设为 `"lazy"` 仅渲染看板上可见的卡片 +- [`scrollType`](api/config/js_kanban_scrolltype_config.md) - 设为 `"column"` 使每列独立滚动 以下代码片段启用懒加载渲染和按列独立滚动： @@ -488,7 +488,7 @@ new kanban.Kanban("#root", { :::important 当 `renderType: "lazy"` 与任意 `scrollType` 组合使用时，需通过 [`cardHeight`](api/config/js_kanban_cardheight_config.md) 属性为卡片设置固定高度。不设置 `cardHeight` 时，懒加载渲染将无法正确显示卡片。 -如果在 `renderType: "lazy"` 和 `scrollType: "column"` 同时启用时省略了 `cardHeight`，控件将根据 [`cardShape`](api/config/js_kanban_cardshape_config.md) 中可见字段对卡片高度进行实验性的近似估算。对于使用自定义 [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) 的看板，控件无法预测渲染高度——请提供一个自定义的 [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md) 函数，返回卡片的预估高度。 +如果在 `renderType: "lazy"` 和 `scrollType: "column"` 同时启用时省略了 `cardHeight`，控件将根据 [`cardShape`](api/config/js_kanban_cardshape_config.md) 中可见字段对卡片高度进行实验性的近似估算。对于使用自定义 [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) 的看板，控件无法预测渲染高度。请提供一个自定义的 [`getCardHeight(cardShape, card, cardWidth)`](api/config/js_kanban_getcardheight_config.md) 函数，返回卡片的预估高度。 ::: ## 变更历史 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/customization.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/customization.md index e9e77a1..31804a5 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/customization.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/customization.md @@ -8,12 +8,12 @@ description: 使用 DHTMLX Kanban 自定义指南，通过文档化的 API 模 您可以通过以下属性自定义 Kanban 的外观和行为： -- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) — 使用自定义 HTML 模板渲染卡片 -- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md)、[`columnShape.menu`](api/config/js_kanban_columnshape_config.md)、[`rowShape.menu`](api/config/js_kanban_rowshape_config.md) — 修改卡片、列和行的右键菜单 -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md)、[`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — 替换列标题模板 -- [`cardShape.css`](api/config/js_kanban_cardshape_config.md)、[`columnShape.css`](api/config/js_kanban_columnshape_config.md)、[`rowShape.css`](api/config/js_kanban_rowshape_config.md) — 按条件应用 CSS 类 -- [`items`](api/config/toolbar_items_config.md) — 重新排列 Toolbar 结构并添加自定义控件 -- CSS 变量 — 调整视觉样式（请参阅 [样式化](guides/stylization.md) 部分） +- [`cardTemplate`](api/config/js_kanban_cardtemplate_config.md) - 使用自定义 HTML 模板渲染卡片 +- [`cardShape.menu`](api/config/js_kanban_cardshape_config.md)、[`columnShape.menu`](api/config/js_kanban_columnshape_config.md)、[`rowShape.menu`](api/config/js_kanban_rowshape_config.md) - 修改卡片、列和行的右键菜单 +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md)、[`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - 替换列标题模板 +- [`cardShape.css`](api/config/js_kanban_cardshape_config.md)、[`columnShape.css`](api/config/js_kanban_columnshape_config.md)、[`rowShape.css`](api/config/js_kanban_rowshape_config.md) - 按条件应用 CSS 类 +- [`items`](api/config/toolbar_items_config.md) - 重新排列 Toolbar 结构并添加自定义控件 +- CSS 变量 - 调整视觉样式（请参阅 [样式化](guides/stylization.md) 部分） ## 自定义卡片 {#custom-cards} @@ -21,10 +21,10 @@ description: 使用 DHTMLX Kanban 自定义指南，通过文档化的 API 模 回调函数接收一个包含以下参数的对象： -- `cardFields` — 卡片数据 -- `selected` — 卡片是否被选中 -- `dragging` — 卡片是否正在被拖动 -- `cardShape` — 卡片配置 +- `cardFields` - 卡片数据 +- `selected` - 卡片是否被选中 +- `dragging` - 卡片是否正在被拖动 +- `cardShape` - 卡片配置 要在自定义卡片模板中嵌入右键菜单触发器，请将菜单图标包裹在带有 `data-menu-id=${cardFields.id}` 属性的 `
` 中（与内置卡片结构相同）。组件通过该属性将菜单绑定到包装元素。 @@ -40,21 +40,21 @@ description: 使用 DHTMLX Kanban 自定义指南，通过文档化的 API 模 默认情况下，卡片菜单显示**复制**和**删除**选项。可用的内置操作 ID： -- `"duplicate-card"` — 复制卡片 -- `"delete-card"` — 删除卡片 +- `"duplicate-card"` - 复制卡片 +- `"delete-card"` - 删除卡片 ### `columnShape.menu` -- `"add-card"` — 向列中添加新卡片 -- `"set-edit"` — 重命名列 -- `"move-column:left"`、`"move-column:right"` — 向左或向右移动列 -- `"delete-column"` — 删除列 +- `"add-card"` - 向列中添加新卡片 +- `"set-edit"` - 重命名列 +- `"move-column:left"`、`"move-column:right"` - 向左或向右移动列 +- `"delete-column"` - 删除列 ### `rowShape.menu` -- `"set-edit"` — 重命名行 -- `"move-row:up"`、`"move-row:down"` — 向上或向下移动行 -- `"delete-row"` — 删除行 +- `"set-edit"` - 重命名行 +- `"move-row:up"`、`"move-row:down"` - 向上或向下移动行 +- `"delete-row"` - 删除行 将 `menu.items` 设置为函数，可以为每张卡片、列或行渲染不同的菜单。从函数中返回 `null` 或 `false` 可隐藏特定项目的菜单。 @@ -66,9 +66,9 @@ description: 使用 DHTMLX Kanban 自定义指南，通过文档化的 API 模 [`columnShape`](api/config/js_kanban_columnshape_config.md) 属性为列标题提供模板和行为配置： -- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) — 展开状态下列标题的 HTML 模板 -- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) — 折叠状态下列标题的 HTML 模板 -- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) — 垂直滚动时固定列标题（默认值：`true`） +- [`columnShape.headerTemplate`](api/config/js_kanban_columnshape_config.md) - 展开状态下列标题的 HTML 模板 +- [`columnShape.collapsedTemplate`](api/config/js_kanban_columnshape_config.md) - 折叠状态下列标题的 HTML 模板 +- [`columnShape.fixedHeaders`](api/config/js_kanban_columnshape_config.md) - 垂直滚动时固定列标题（默认值：`true`） 以下代码片段设置了一个包含折叠图标、带卡片数量的标签以及菜单触发器的自定义标题模板： @@ -103,9 +103,9 @@ new kanban.Kanban("#root", { 要按条件应用 CSS 类，请将函数传递给 [`cardShape`](api/config/js_kanban_cardshape_config.md)、[`columnShape`](api/config/js_kanban_columnshape_config.md) 或 [`rowShape`](api/config/js_kanban_rowshape_config.md) 的 `css` 参数。该函数根据当前数据返回类名： -- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) — 应用于卡片的类 -- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) — 应用于列的类 -- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) — 应用于行的类 +- [`cardShape.css: (card) => string`](api/config/js_kanban_cardshape_config.md) - 应用于卡片的类 +- [`columnShape.css: (column, cards) => string`](api/config/js_kanban_columnshape_config.md) - 应用于列的类 +- [`rowShape.css: (row, cards) => string`](api/config/js_kanban_rowshape_config.md) - 应用于行的类 以下代码片段高亮显示逾期卡片和负载不足的列： diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/initialization.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/initialization.md index af16637..61b083d 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/initialization.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/initialization.md @@ -81,8 +81,8 @@ new kanban.Toolbar("#toolbar", { 完整配置参考： -- [Kanban 属性概览](api/overview/properties_overview.md) — 所有 Kanban 配置属性 -- [Toolbar 属性概览](api/overview/toolbar_properties_overview.md) — 所有 Toolbar 配置属性 +- [Kanban 属性概览](api/overview/properties_overview.md) - 所有 Kanban 配置属性 +- [Toolbar 属性概览](api/overview/toolbar_properties_overview.md) - 所有 Toolbar 配置属性 ## 示例 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration.md index deec001..a5687e3 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration.md @@ -1,6 +1,6 @@ --- sidebar_label: 与DHTMLX小部件集成 -title: DHTMLX 小部件——Kanban 集成指南 +title: DHTMLX 小部件 - Kanban 集成指南 description: 参阅 DHTMLX Kanban 与 DHTMLX Gantt、Event Calendar 和 To Do List 小部件的集成指南。了解如何在同一应用中将 Kanban 与 Gantt 及其他 DHTMLX 组件结合使用。 --- diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md index db267e7..a8bfea5 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/integration_with_svelte.md @@ -20,8 +20,8 @@ DHTMLX Kanban 与 Svelte 兼容。完整的代码示例可在 [GitHub](https://g 通过以下两种方式之一创建 Svelte 项目： -- 使用 [SvelteKit](https://kit.svelte.dev/) — 推荐 -- 使用 Svelte 和 Vite（不使用 SvelteKit）— 运行： +- 使用 [SvelteKit](https://kit.svelte.dev/) - 推荐 +- 使用 Svelte 和 Vite（不使用 SvelteKit）- 运行： ~~~json npm create vite@latest diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/localization.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/localization.md index 0fde7bd..2157639 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/localization.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/localization.md @@ -144,11 +144,11 @@ const en = { 语言环境对象包含五个顶级部分： -- `lang` — 语言代码（例如 `"en-US"`） -- `kanban` — 界面标签（按钮、对话框、搜索、排序选项、链接关系） -- `calendar` — 日期选择器标签和设置（月份和星期名称、时钟格式、周起始日、AM/PM 标记） -- `formats` — 日期和时间格式模式（`timeFormat`、`dateFormat`、`monthYearFormat`、`yearFormat`） -- `core` — 共享对话框按钮（`ok`、`cancel`） +- `lang` - 语言代码（例如 `"en-US"`） +- `kanban` - 界面标签（按钮、对话框、搜索、排序选项、链接关系） +- `calendar` - 日期选择器标签和设置（月份和星期名称、时钟格式、周起始日、AM/PM 标记） +- `formats` - 日期和时间格式模式（`timeFormat`、`dateFormat`、`monthYearFormat`、`yearFormat`） +- `core` - 共享对话框按钮（`ok`、`cancel`） 语言环境对象必须包含所有 Kanban 和 Toolbar 标签的翻译。 @@ -156,15 +156,15 @@ const en = { Kanban 导出了以下内置语言环境： -- `"en"` — 英语 -- `"de"` — 德语 -- `"cn"` — 中文 -- `"es"` — 西班牙语 -- `"fr"` — 法语 -- `"it"` — 意大利语 -- `"jp"` — 日语 -- `"pt"` — 葡萄牙语 -- `"ru"` — 俄语 +- `"en"` - 英语 +- `"de"` - 德语 +- `"cn"` - 中文 +- `"es"` - 西班牙语 +- `"fr"` - 法语 +- `"it"` - 意大利语 +- `"jp"` - 日语 +- `"pt"` - 葡萄牙语 +- `"ru"` - 俄语 通过 `kanban.locales[""]` 访问语言环境。Toolbar 是一个独立的组件，因此需要单独为其应用语言环境。以下代码片段在初始化时将 `"cn"` 语言环境同时应用到 Kanban 和 Toolbar： diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/stylization.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/stylization.md index b52ba5a..c2122cb 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/stylization.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/stylization.md @@ -8,8 +8,8 @@ description: 阅读 DHTMLX Kanban 样式化指南。了解如何通过 CSS 类 您可以通过 CSS 类和 CSS 变量来设置 Kanban 的外观样式。以下属性可接受针对列、行和卡片的 CSS 类： -- [`columnShape.css`](api/config/js_kanban_columnshape_config.md)、[`rowShape.css`](api/config/js_kanban_rowshape_config.md)、[`cardShape.css`](api/config/js_kanban_cardshape_config.md) — 根据条目数据有条件地返回 CSS 类的函数 -- [`columns.css`](api/config/js_kanban_columns_config.md)、[`rows.css`](api/config/js_kanban_rows_config.md)、[`cards.css`](api/config/js_kanban_cards_config.md) — 分配给单个条目的字符串 CSS 类 +- [`columnShape.css`](api/config/js_kanban_columnshape_config.md)、[`rowShape.css`](api/config/js_kanban_rowshape_config.md)、[`cardShape.css`](api/config/js_kanban_cardshape_config.md) - 根据条目数据有条件地返回 CSS 类的函数 +- [`columns.css`](api/config/js_kanban_columns_config.md)、[`rows.css`](api/config/js_kanban_rows_config.md)、[`cards.css`](api/config/js_kanban_cards_config.md) - 分配给单个条目的字符串 CSS 类 有关条件 `css` 函数的详细信息和代码示例，请参阅[条件 CSS 类](guides/customization.md#conditional-css-classes)。 @@ -32,8 +32,8 @@ const cards = [ 除了按条目设置 CSS 外，Kanban 还提供用于主题化的 CSS 变量。变量分为两组： -- Kanban 变量 — 定义 Kanban 特有的样式 -- WX 库变量 — 设置共享 UI 元素（控件、日历）的样式 +- Kanban 变量 - 定义 Kanban 特有的样式 +- WX 库变量 - 设置共享 UI 元素（控件、日历）的样式 :::info WX 库驱动 Kanban 内部 UI 组件。请将 WX 变量视为 Kanban 样式的一部分。 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_data.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_data.md index 5868404..958b54d 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_data.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_data.md @@ -146,62 +146,62 @@ board.setConfig({ columns, cards, rows }); ## 获取数据 -- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) — 获取指定列（及可选行）中所有卡片的数据对象 -- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) — 获取指定列中所有卡片的数据对象 -- [`getCard()`](api/methods/js_kanban_getcard_method.md) — 通过 ID 获取某个卡片的数据对象 -- [`serialize()`](api/methods/js_kanban_serialize_method.md) — 以 JSON 对象形式返回 Kanban 数据 +- [`getAreaCards()`](api/methods/js_kanban_getareacards_method.md) - 获取指定列（及可选行）中所有卡片的数据对象 +- [`getColumnCards()`](api/methods/js_kanban_getcolumncards_method.md) - 获取指定列中所有卡片的数据对象 +- [`getCard()`](api/methods/js_kanban_getcard_method.md) - 通过 ID 获取某个卡片的数据对象 +- [`serialize()`](api/methods/js_kanban_serialize_method.md) - 以 JSON 对象形式返回 Kanban 数据 ## 获取状态 -- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) — 获取 *DataStore* 的响应式属性 -- [`api.getState()`](api/internal/js_kanban_getstate_method.md) — 获取 *DataStore* 的当前属性 -- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) — 返回 `{ data: DataStore }` +- [`api.getReactiveState()`](api/internal/js_kanban_getreactivestate_method.md) - 获取 *DataStore* 的响应式属性 +- [`api.getState()`](api/internal/js_kanban_getstate_method.md) - 获取 *DataStore* 的当前属性 +- [`api.getStores()`](api/internal/js_kanban_getstores_method.md) - 返回 `{ data: DataStore }` ## 导出数据 -- [`export.json()`](api/internal/js_kanban_json_method.md) — 将 Kanban 数据下载为 JSON 文件 +- [`export.json()`](api/internal/js_kanban_json_method.md) - 将 Kanban 数据下载为 JSON 文件 ## 添加新项 -- [`addCard()`](api/methods/js_kanban_addcard_method.md) — 添加新卡片 -- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) — 添加新列 -- [`addRow()`](api/methods/js_kanban_addrow_method.md) — 添加新行 -- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) — 通过 ID 复制卡片 +- [`addCard()`](api/methods/js_kanban_addcard_method.md) - 添加新卡片 +- [`addColumn()`](api/methods/js_kanban_addcolumn_method.md) - 添加新列 +- [`addRow()`](api/methods/js_kanban_addrow_method.md) - 添加新行 +- [`duplicateCard()`](api/methods/js_kanban_duplicatecard_method.md) - 通过 ID 复制卡片 ## 更新项 -- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) — 通过 ID 更新卡片 -- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) — 通过 ID 更新列 -- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) — 通过 ID 更新行 +- [`updateCard()`](api/methods/js_kanban_updatecard_method.md) - 通过 ID 更新卡片 +- [`updateColumn()`](api/methods/js_kanban_updatecolumn_method.md) - 通过 ID 更新列 +- [`updateRow()`](api/methods/js_kanban_updaterow_method.md) - 通过 ID 更新行 ## 删除项 -- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) — 通过 ID 移除卡片 -- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) — 通过 ID 移除列 -- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) — 通过 ID 移除行 +- [`deleteCard()`](api/methods/js_kanban_deletecard_method.md) - 通过 ID 移除卡片 +- [`deleteColumn()`](api/methods/js_kanban_deletecolumn_method.md) - 通过 ID 移除列 +- [`deleteRow()`](api/methods/js_kanban_deleterow_method.md) - 通过 ID 移除行 ## 移动项 -- [`moveCard()`](api/methods/js_kanban_movecard_method.md) — 将卡片移动到目标列和行 -- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) — 将列移动到新位置 -- [`moveRow()`](api/methods/js_kanban_moverow_method.md) — 将行移动到新位置 +- [`moveCard()`](api/methods/js_kanban_movecard_method.md) - 将卡片移动到目标列和行 +- [`moveColumn()`](api/methods/js_kanban_movecolumn_method.md) - 将列移动到新位置 +- [`moveRow()`](api/methods/js_kanban_moverow_method.md) - 将行移动到新位置 ## 管理评论 -- [`addComment()`](api/methods/js_kanban_addcomment_method.md) — 通过 ID 向卡片添加评论 -- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) — 通过 ID 更新评论 -- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) — 通过 ID 删除评论 +- [`addComment()`](api/methods/js_kanban_addcomment_method.md) - 通过 ID 向卡片添加评论 +- [`updateComment()`](api/methods/js_kanban_updatecomment_method.md) - 通过 ID 更新评论 +- [`deleteComment()`](api/methods/js_kanban_deletecomment_method.md) - 通过 ID 删除评论 ## 管理链接 -- [`addLink()`](api/methods/js_kanban_addlink_method.md) — 在卡片之间添加新链接 -- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) — 通过 ID 删除链接 +- [`addLink()`](api/methods/js_kanban_addlink_method.md) - 在卡片之间添加新链接 +- [`deleteLink()`](api/methods/js_kanban_deletelink_method.md) - 通过 ID 删除链接 ## 管理卡片选择 -- [`getSelection()`](api/methods/js_kanban_getselection_method.md) — 获取当前选中卡片的 ID -- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) — 通过 ID 选中卡片 -- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) — 通过 ID 取消选中卡片 +- [`getSelection()`](api/methods/js_kanban_getselection_method.md) - 获取当前选中卡片的 ID +- [`selectCard()`](api/methods/js_kanban_selectcard_method.md) - 通过 ID 选中卡片 +- [`unselectCard()`](api/methods/js_kanban_unselectcard_method.md) - 通过 ID 取消选中卡片 ## 示例 diff --git a/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_server.md b/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_server.md index 60887df..554f96c 100644 --- a/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_server.md +++ b/i18n/zh/docusaurus-plugin-content-docs/current/guides/working_with_server.md @@ -40,20 +40,20 @@ JavaScript Kanban 提供了 `RestDataProvider` 服务，完全支持与后端通 `RestDataProvider` 服务提供以下 REST 方法： -- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) — 获取 cards 数据的 Promise -- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) — 获取 columns 数据的 Promise -- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) — 返回 provider 使用的默认 action handler -- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) — 返回一个将临时客户端 ID 解析为后端 ID 的函数 -- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) — 获取 links 数据的 Promise -- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) — 返回 provider 处理的内部 action 队列 -- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) — 获取 rows 数据的 Promise -- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) — 获取 users 数据的 Promise -- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) — 发送自定义 HTTP 请求并返回 Promise -- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) — 设置附加到每个请求的自定义 HTTP 请求头 +- [`getCards()`](api/provider/rest_methods/js_kanban_getcards_method.md) - 获取 cards 数据的 Promise +- [`getColumns()`](api/provider/rest_methods/js_kanban_getcolumns_method.md) - 获取 columns 数据的 Promise +- [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) - 返回 provider 使用的默认 action handler +- [`getIDResolver()`](api/provider/rest_methods/js_kanban_getidresolver_method.md) - 返回一个将临时客户端 ID 解析为后端 ID 的函数 +- [`getLinks()`](api/provider/rest_methods/js_kanban_getlinks_method.md) - 获取 links 数据的 Promise +- [`getQueue()`](api/provider/rest_methods/js_kanban_getqueue_method.md) - 返回 provider 处理的内部 action 队列 +- [`getRows()`](api/provider/rest_methods/js_kanban_getrows_method.md) - 获取 rows 数据的 Promise +- [`getUsers()`](api/provider/rest_methods/js_kanban_getusers_method.md) - 获取 users 数据的 Promise +- [`send()`](api/provider/rest_methods/js_kanban_send_method.md) - 发送自定义 HTTP 请求并返回 Promise +- [`setHeaders()`](api/provider/rest_methods/js_kanban_setheaders_method.md) - 设置附加到每个请求的自定义 HTTP 请求头 ## 自定义 RestDataProvider -要自定义 `RestDataProvider` 向服务器发送数据操作的方式，可以继承该类并覆盖其中的某个方法。最常见的自定义目标是默认 action handler——例如，为自定义事件添加 handler，或扩展现有操作的 payload。 +要自定义 `RestDataProvider` 向服务器发送数据操作的方式，可以继承该类并覆盖其中的某个方法。最常见的自定义目标是默认 action handler，例如为自定义事件添加 handler，或扩展现有操作的 payload。 若要在不丢失默认 handler 的情况下添加自定义 handler，请覆盖 [`getHandlers()`](api/provider/rest_methods/js_kanban_gethandlers_method.md) 方法，并将自定义条目合并到 `super.getHandlers()` 的结果之上： @@ -75,7 +75,7 @@ board.api.setNext(restProvider); ~~~ :::warning -覆盖时务必调用 `super.getHandlers()` 并展开其结果。不要手动将默认 handler 复制到覆盖方法中——action 映射可能在不同版本间发生变化，硬编码的副本可能在不知不觉中与当前默认值脱节。 +覆盖时务必调用 `super.getHandlers()` 并展开其结果。不要手动将默认 handler 复制到覆盖方法中。action 映射可能在不同版本间发生变化，硬编码的副本可能在不知不觉中与当前默认值脱节。 ::: 另一个常见的自定义目标是 [`send()`](api/provider/rest_methods/js_kanban_send_method.md) 方法，每个默认 handler 都会调用该方法。覆盖 `send()` 可注入额外请求头、重写 URL，或为每个服务器请求添加自定义逻辑。 @@ -218,8 +218,8 @@ events.on(handlers); 该代码片段中使用了以下标识符： -- `handlers` — 处理服务器事件的客户端处理函数 -- `events` — 监听服务器传入事件的 `RemoteEvents` 实例 +- `handlers` - 处理服务器事件的客户端处理函数 +- `events` - 监听服务器传入事件的 `RemoteEvents` 实例 `events.on(handlers)` 调用将客户端处理函数注册到服务器端事件。组件现在可以实时响应服务器端的变更。 @@ -295,11 +295,11 @@ remoteEvents.on(handlers); `type` 参数标识模型类型： -- `CardID` — `1` -- `RowID` — `2` -- `ColumnID` — `3` -- `LinkID` — `4` -- `CommentID` — `5` +- `CardID` - `1` +- `RowID` - `2` +- `ColumnID` - `3` +- `LinkID` - `4` +- `CommentID` - `5` 要防止请求发送到服务器，调用 `board.api.exec()` 时需传入 `skipProvider: true`。`remoteEvents.on(handlers)` 调用负责注册自定义处理函数。 @@ -311,9 +311,9 @@ remoteEvents.on(handlers); 定义分组规则。下例使用以下状态进行分组： -- `todo`, `unassigned` — 属于 **Open** 列 -- `dev`, `testing` — 属于 **Inprogress** 列 -- `merged`, `released` — 属于 **Done** 列 +- `todo`, `unassigned` - 属于 **Open** 列 +- `dev`, `testing` - 属于 **Inprogress** 列 +- `merged`, `released` - 属于 **Done** 列 有两种实现方式：