Advertisement
szabozoltan69

grid

Nov 3rd, 2020
815
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <vue-editable-grid
  2. class="my-grid-class"
  3. ref="grid"
  4. id="mygrid"
  5. :column-defs="columnDefs"
  6. :row-data="rows"
  7. row-data-key='shipmentId'
  8. @cell-updated="cellUpdated"
  9. @row-selected="rowSelected"
  10. @link-clicked="linkClicked"
  11. >
  12. <template v-slot:header>
  13.     Vue editable grid, by eledwinn
  14. </template>
  15. <template v-slot:header-r>
  16.     Total rows: {{ rows.length }}
  17. </template>
  18. </vue-editable-grid>
  19. export default {
  20.   name: "ReservationImport",
  21.   props: {
  22.   id: { type: String, required: true },
  23.   columnDefs: { type: Array, required: true },
  24.   rowData: { type: Array, required: true },
  25.   rowDataKey: { type: String, required: true },
  26.   enableFilters: { type: Boolean, default: true },
  27.   pageCount: { type: Number, default: 0 },
  28.   itemHeight: { type: Number, default: 30 },
  29.   virtualScrollOffset: { type: Number, default: 3 },
  30.   onlyBorder: { type: Boolean, default: true }
  31.   },
  32.   data() {
  33.     return {
  34.       loading: true,
  35.       ajaxLoading: true,
  36.       layout: "list",
  37.       statusList: [],
  38.       search: [],
  39.       paginationEnd: false,
  40.       reservations: [],
  41.       columnDefs = [
  42.   { sortable: true, filter: true, field: 'eyeColor', headerName: 'Eye color', editable: true },
  43.   { sortable: true, filter: true, field: 'name', headerName: 'Name', editable: true },
  44.   { sortable: true, filter: true, field: 'registered', headerName: 'registered', type: 'date', format: 'MMM dd, yyyy', editable: true },
  45.   { sortable: true, filter: true, field: 'age', headerName: 'Age', type: 'numeric', editable: true },
  46.   { sortable: true, filter: true, field: 'balance', headerName: 'Balance', type: 'currency', editable: true },
  47.   { sortable: true, filter: true, field: 'happiness', headerName: 'Happiness percent', type: 'percent', editable: true },
  48.   { sortable: true, filter: true, field: 'isActive', headerName: 'Is active', type: 'boolean', editable: true },
  49.   { sortable: true, filter: true, field: 'picture', headerName: 'Picture', type: 'link', editable: false }
  50. ]
  51.     };
  52.   },
  53.   computed: {},
  54.   created() {}
  55. }
  56.  
Advertisement
Advertisement
Advertisement
RAW Paste Data Copied
Advertisement