<div class="change-cost-center-table">

    <div class="table-header">

        <div class="table-header__column--title">

            <h4 class="table-header__title">Bitte wählen Sie eine Kostenstellen</h4>

        </div>

    </div>
    <div class="responsive-table -spacing-large">
        <div class="table-search">
            <div class="table-search__container">

                <div class="text-field--light text-field-search--light is-initialized" data-disable-text-field-js>
                    <div class="text-field__wrapper text-field-search__wrapper">
                        <input class="text-field__input text-field-search__input" id="responsive-table-search" type="text" name="responsive-table-search" required data-responsive-table-search="true" placeholder="Suche" />
                        <label class="visually-hidden" for="responsive-table-search">Suche</label>
                        <button type="reset" class="text-field-search__reset"></button>
                        <button type="submit" class="text-field-search__search"></button>
                        <div class="text-field-search__loader ">
                            <div class="loading-spinner -vertical -horizontal">
                                <div class="loading-spinner__spinner--small"></div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
        </div>
        <div class="responsive-table__container--auto-scrollbar">
            <table class="responsive-table__table" data-responsive-table-filter-context>
                <colgroup>
                    <col style="">
                    <col style="">
                    <col style="">
                    <col style="64px">
                </colgroup>
                <thead>
                    <tr class="responsive-table__tr">
                        <th class="responsive-table__th">
                            Kostenstelle
                        </th>
                        <th class="responsive-table__th">
                            Adresse
                        </th>
                        <th class="responsive-table__th is-centered">
                            Standard
                        </th>
                        <th class="responsive-table__th">

                        </th>
                    </tr>
                </thead>
                <tbody>
                    <tr class="responsive-table__tr change-cost-center-table__row">
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Kostenstelle</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p>415050 Küche</p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Adresse</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p></p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-centered">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Standard</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="button-set-as-default">
                                            <form class="button-set-as-default__container is-active" action="http://localhost:3005/set-default-cost-center/" method="post">
                                                <button type="submit" class="button-set-as-default__button">
                                                    <span class="visually-hidden">Als standard Kostenstelle festlegen</span>
                                                </button>
                                            </form>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-right-aligned">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title"></div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="change-cost-center-table__arrow-right-button">
                                            <button class="button--primary" type="submit"> <span class="change-cost-center-table__button">
                                                    <span class="visually-hidden"></span>
                                                    <span class="change-cost-center-table__button-icon"></span>
                                                </span></button>
                                        </div>

                                    </div>

                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr class="responsive-table__tr change-cost-center-table__row">
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Kostenstelle</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p>415051 Hotellerie</p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Adresse</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p>Lager Schaffhausen, Musterstrasse 12, Schaffhausen 8200</p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-centered">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Standard</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="button-set-as-default">
                                            <form class="button-set-as-default__container" action="http://localhost:3005/set-default-cost-center/" method="post">
                                                <button type="submit" class="button-set-as-default__button">
                                                    <span class="visually-hidden">Als standard Kostenstelle festlegen</span>
                                                </button>
                                            </form>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-right-aligned">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title"></div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="change-cost-center-table__arrow-right-button">
                                            <button class="button--primary" type="submit"> <span class="change-cost-center-table__button">
                                                    <span class="visually-hidden"></span>
                                                    <span class="change-cost-center-table__button-icon"></span>
                                                </span></button>
                                        </div>

                                    </div>

                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr class="responsive-table__tr change-cost-center-table__row">
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Kostenstelle</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p>415052 Pflege</p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Adresse</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p></p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-centered">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Standard</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="button-set-as-default">
                                            <form class="button-set-as-default__container" action="http://localhost:3005/set-default-cost-center/" method="post">
                                                <button type="submit" class="button-set-as-default__button">
                                                    <span class="visually-hidden">Als standard Kostenstelle festlegen</span>
                                                </button>
                                            </form>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-right-aligned">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title"></div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="change-cost-center-table__arrow-right-button">
                                            <button class="button--primary" type="submit"> <span class="change-cost-center-table__button">
                                                    <span class="visually-hidden"></span>
                                                    <span class="change-cost-center-table__button-icon"></span>
                                                </span></button>
                                        </div>

                                    </div>

                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr class="responsive-table__tr change-cost-center-table__row">
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Kostenstelle</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p>415053 Einkauf</p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Adresse</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p></p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-centered">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Standard</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="button-set-as-default">
                                            <form class="button-set-as-default__container" action="http://localhost:3005/set-default-cost-center/" method="post">
                                                <button type="submit" class="button-set-as-default__button">
                                                    <span class="visually-hidden">Als standard Kostenstelle festlegen</span>
                                                </button>
                                            </form>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-right-aligned">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title"></div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="change-cost-center-table__arrow-right-button">
                                            <button class="button--primary" type="submit"> <span class="change-cost-center-table__button">
                                                    <span class="visually-hidden"></span>
                                                    <span class="change-cost-center-table__button-icon"></span>
                                                </span></button>
                                        </div>

                                    </div>

                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr class="responsive-table__tr change-cost-center-table__row">
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Kostenstelle</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p>415054 Bistro</p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Adresse</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="wysiwyg-content">
                                            <p></p>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-centered">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title">Standard</div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="button-set-as-default">
                                            <form class="button-set-as-default__container" action="http://localhost:3005/set-default-cost-center/" method="post">
                                                <button type="submit" class="button-set-as-default__button">
                                                    <span class="visually-hidden">Als standard Kostenstelle festlegen</span>
                                                </button>
                                            </form>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </td>
                        <td class="responsive-table__td is-right-aligned">
                            <div class="responsive-table__mobile-container">
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__mobile-column-title"></div>
                                </div>
                                <div class="responsive-table__mobile-column">
                                    <div class="responsive-table__td-inner-container">
                                        <div class="change-cost-center-table__arrow-right-button">
                                            <button class="button--primary" type="submit"> <span class="change-cost-center-table__button">
                                                    <span class="visually-hidden"></span>
                                                    <span class="change-cost-center-table__button-icon"></span>
                                                </span></button>
                                        </div>

                                    </div>

                                </div>
                            </div>
                        </td>
                    </tr>
                    <tr class="responsive-table__tr" data-responsive-table-filter-no-match hidden>
                        <td class="responsive-table__td" colspan="4">
                            <div class="wysiwyg-content">
                                <p class="responsive-table__no-match">Keine Kostenstellen gefunden</p>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>
{% include '@SharedComponents/modules/b2b-checkout/components/change-cost-center-table/change-cost-center-table.twig' %}
{
  "tableHeader": {
    "heading": {
      "level": "4",
      "title": "Bitte wählen Sie eine Kostenstellen"
    }
  },
  "table": {
    "noMatchMessage": "Keine Kostenstellen gefunden",
    "autoScrollbar": true,
    "search": {
      "searchField": {
        "variant": "light",
        "id": "responsive-table-search",
        "name": "responsive-table-search",
        "label": "Suche",
        "required": true,
        "value": "",
        "disabled": false,
        "error": "",
        "type": "text",
        "autocomplete": "",
        "attributes": {
          "data-responsive-table-search": "true"
        }
      }
    },
    "columnDefs": [
      {
        "label": "Kostenstelle",
        "name": "costCenter"
      },
      {
        "label": "Adresse",
        "name": "costCenterAddress"
      },
      {
        "label": "Standard",
        "name": "defaultCostCenter",
        "thClass": "is-centered"
      },
      {
        "name": "action",
        "width": "64px"
      }
    ],
    "rowData": [
      {
        "rowClass": "change-cost-center-table__row",
        "costCenter": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p>415050 Küche</p>"
          }
        },
        "costCenterAddress": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p></p>"
          }
        },
        "defaultCostCenter": {
          "type": "template",
          "path": "modules/shared/components/button-set-as-default/button-set-as-default",
          "tdClass": "is-centered",
          "data": {
            "method": "post",
            "action": "http://localhost:3005/set-default-cost-center/",
            "buttonTitle": "Als standard Kostenstelle festlegen",
            "active": true
          }
        },
        "action": {
          "type": "text",
          "tdClass": "is-right-aligned",
          "data": {
            "variant": "primary",
            "type": "button",
            "disabled": false
          }
        }
      },
      {
        "rowClass": "change-cost-center-table__row",
        "costCenter": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p>415051 Hotellerie</p>"
          }
        },
        "costCenterAddress": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p>Lager Schaffhausen, Musterstrasse 12, Schaffhausen 8200</p>"
          }
        },
        "defaultCostCenter": {
          "type": "template",
          "path": "modules/shared/components/button-set-as-default/button-set-as-default",
          "tdClass": "is-centered",
          "data": {
            "method": "post",
            "action": "http://localhost:3005/set-default-cost-center/",
            "buttonTitle": "Als standard Kostenstelle festlegen"
          }
        },
        "action": {
          "type": "text",
          "tdClass": "is-right-aligned",
          "data": {
            "variant": "primary",
            "type": "button",
            "disabled": false
          }
        }
      },
      {
        "rowClass": "change-cost-center-table__row",
        "costCenter": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p>415052 Pflege</p>"
          }
        },
        "costCenterAddress": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p></p>"
          }
        },
        "defaultCostCenter": {
          "type": "template",
          "path": "modules/shared/components/button-set-as-default/button-set-as-default",
          "tdClass": "is-centered",
          "data": {
            "method": "post",
            "action": "http://localhost:3005/set-default-cost-center/",
            "buttonTitle": "Als standard Kostenstelle festlegen"
          }
        },
        "action": {
          "type": "text",
          "tdClass": "is-right-aligned",
          "data": {
            "variant": "primary",
            "type": "button",
            "disabled": false
          }
        }
      },
      {
        "rowClass": "change-cost-center-table__row",
        "costCenter": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p>415053 Einkauf</p>"
          }
        },
        "costCenterAddress": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p></p>"
          }
        },
        "defaultCostCenter": {
          "type": "template",
          "path": "modules/shared/components/button-set-as-default/button-set-as-default",
          "tdClass": "is-centered",
          "data": {
            "method": "post",
            "action": "http://localhost:3005/set-default-cost-center/",
            "buttonTitle": "Als standard Kostenstelle festlegen"
          }
        },
        "action": {
          "type": "text",
          "tdClass": "is-right-aligned",
          "data": {
            "variant": "primary",
            "type": "button",
            "disabled": false
          }
        }
      },
      {
        "rowClass": "change-cost-center-table__row",
        "costCenter": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p>415054 Bistro</p>"
          }
        },
        "costCenterAddress": {
          "type": "template",
          "path": "modules/shared/components/wysiwyg-content/wysiwyg-content",
          "data": {
            "content": "<p></p>"
          }
        },
        "defaultCostCenter": {
          "type": "template",
          "path": "modules/shared/components/button-set-as-default/button-set-as-default",
          "tdClass": "is-centered",
          "data": {
            "method": "post",
            "action": "http://localhost:3005/set-default-cost-center/",
            "buttonTitle": "Als standard Kostenstelle festlegen"
          }
        },
        "action": {
          "type": "text",
          "tdClass": "is-right-aligned",
          "data": {
            "variant": "primary",
            "type": "button",
            "disabled": false
          }
        }
      }
    ]
  }
}
  • Content:
    @import "~shared/base";
    @import "~cando-cx-components-library/components/modules/b2b-checkout/components/change-cost-center-table/change-cost-center-table";
  • URL: /components/raw/change-cost-center-table/change-cost-center-table.scss
  • Filesystem Path: src/components/modules/b2b-checkout/components/change-cost-center-table/change-cost-center-table.scss
  • Size: 156 Bytes

No notes defined.