LargeTextColumnComponent

This component allows you to large text column

Example

LargeTextColumnComponent

<template>
  <div>
    <section>
      <server-table-component
        data-url="/services"
        v-bind="servicesDefinition"
      />
    </section>
  </div>
</template>;

export default {
  name: "App",
  data() {
    return {
      servicesDefinition: {
        vtable: {
          headers: [
            {
              text: "Service Id",
              value: "service_Id",
              align: "left",
              render: {
                type: LargeTextColumnComponent,
                props: {
                  showDisplayButton: true,
                  showCopyButton: false,
                  content: this.$tc("category", 2),
                  locale: this.$i18n.locale,
                  textLenght: 30,
                  tooltipPosition: "is-top",
                },
              },
              sortable: true,
              class: "white-space-nowrap",
            },
          ],
        },
      },
    };
  },
};

Props

NameDescriptionTypeRequiredDefault
value-Stringfalse-
textLenght-Numberfalse50
fallbackValueValue fallbackStringfalse"---"
roundedButtons-Booleanfalsetrue
buttonsSize-Stringfalse"is-small"
buttonsClass-Stringfalse"table-buttons"
modalTitleClass-Stringfalse"is-size-5 has-text-primary has-text-centered"
modalWidth-Numberfalse400
content-Stringfalse-
showCopyButton-Booleanfalsetrue
showDisplayButton-Booleanfalsefalse
appendToBodyAppend content to body (prevents event bubbling)Booleanfalsefalse
tooltipPosition-Stringfalse"is-top"
tooltipType-Stringfalse"is-white"
localeLocale string {en, es ...} for display language on componentStringfalse"en"

Events

Event NameDescriptionParameters
copiedToClipboard--