Em-grid-card-items NPM

em-grid-card-items

Card grid

Install

npm install --save em-grid-card-items

Add to project

Global

#stylesheet.css

Vue.use options

// main.js
import EmGridCardItems from 'em-grid-card-items'
Vue.use(EmGridCardItems)

Local Usage

<template>
  <div>
      <em-grid-card-items
              :column-count="5"
              :column-spacing="10"
              :row-spacing="10"
              :is-add-mode-item="false"
              mode="add"
              resource-name="products"
              item-prop-name="product"
              em-card-type="EmCardProduct"
              :off-direction="false"
              :card-props="{isEditMode: true}"
              @action=""
      />
      <em-grid-card-items
              :column-count="5"
              resource-name="products"
              item-prop-name="product"
              em-card-type="EmCardProduct"
              :card-props="{isEditMode: true}"
              @action=""
      />
  </div>
</template>
<script>
  export default {
    name: 'component.vue',
  }
</script>

Setup

Parameters

Props(Parameter)	Type	Default	Description
column-count	`Number`	`0`	Number of speakers
column-spacing	`Number`	`20`	Distance between columns of elements
row-spacing	`Number`	`column-spacing`	Distance between rows of elements, if 0 or not set column-spacing is used
resource-name	`String`	null	The api path of the resource on the backend
resource-prefix	`String`	null	Resource api path prefix on backend
resource-params	`Object`	{}	The object of the parameters passed in the request to the api of the resource on the backend
item-prop-name	`String`	null	The name of the parameter by which the object is passed to the component
card-props	`Object`	null	Additional parameters passed to the object in the component
em-card-type	`String`	null	Component name
off-direction	`Boolean`	`false`	Column distribution is done by flex-wrap, column-count is ignored
is-add-mode-item	`Boolean`	`false`	Whether to show the card in the mode of adding elements
check-list	`Array`	`[]`	Array for storing selection of elements
mode	`String`	`padination`,`add`	Resource loading mode
is-dark-button	`Boolean`	`false`	Show more button type true? 'Primary': 'warning'

License

The MIT License

@infinitebrahmanuniverse/nolb-em-@everything-registry/sub-chunk-1571 @zalastax/nolb-em-em-dashboard

2.0.3

4 years ago

2.0.2

4 years ago