archive/pillar
0
0
Fork 0
Code Issues 42 Pull Requests Projects Releases Wiki Activity

Use kebab-case for vue names

Browse Source 
https://vuejs.org/v2/guide/components-custom-events.html#Event-Names
This commit is contained in:
Tobias Johansson 2019-04-04 11:33:43 +02:00
parent ccc78af742
commit ee5a1a8bb7
7 changed files with 31 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/scripts/js/es6/common/vuecomponents/table/Table.js
View File

@ -28,8 +28,8 @@ const TEMPLATE =`
:rowObjects="sortedRowObjects" :rowObjects="sortedRowObjects"
:config="rowFilterConfig" :config="rowFilterConfig"
:componentState="(componentState || {}).rowFilter" :componentState="(componentState || {}).rowFilter"
@visibleRowObjectsChanged="onVisibleRowObjectsChanged" @visible-row-objects-changed="onVisibleRowObjectsChanged"
@componentStateChanged="onRowFilterStateChanged" @component-state-changed="onRowFilterStateChanged"
/> />
<pillar-table-actions <pillar-table-actions
@item-clicked="onItemClicked" @item-clicked="onItemClicked"
@ -37,8 +37,8 @@ const TEMPLATE =`
<pillar-table-column-filter <pillar-table-column-filter
:columns="columns" :columns="columns"
:componentState="(componentState || {}).columnFilter" :componentState="(componentState || {}).columnFilter"
@visibleColumnsChanged="onVisibleColumnsChanged" @visible-columns-changed="onVisibleColumnsChanged"
@componentStateChanged="onColumnFilterStateChanged" @component-state-changed="onColumnFilterStateChanged"
/> />
</div> </div>
<div class="pillar-table"> <div class="pillar-table">
@ -70,9 +70,9 @@ const TEMPLATE =`
* Extend ColumnFactoryBase to create the rows for your table * Extend ColumnFactoryBase to create the rows for your table
* Extend This Table with your ColumnFactory and RowSource * Extend This Table with your ColumnFactory and RowSource
* *
* @emits isInitialized When all rows has been fetched, and are initialized. * @emits is-initialized When all rows has been fetched, and are initialized.
* @emits selectItemsChanged(selectedItems) When selected rows has changed. * @emits selected-items-changed(selectedItems) When selected rows has changed.
* @emits componentStateChanged(newState) When table state changed. Filtered rows, visible columns... * @emits component-state-changed(newState) When table state changed. Filtered rows, visible columns...
*/ */
let PillarTable = Vue.component('pillar-table-base', { let PillarTable = Vue.component('pillar-table-base', {
template: TEMPLATE, template: TEMPLATE,
@ -155,12 +155,12 @@ let PillarTable = Vue.component('pillar-table-base', {
// Deep compare to avoid spamming un needed events // Deep compare to avoid spamming un needed events
let hasChanged = JSON.stringify(newValue ) !== JSON.stringify(oldValue); let hasChanged = JSON.stringify(newValue ) !== JSON.stringify(oldValue);
if (hasChanged) { if (hasChanged) {
this.$emit('selectItemsChanged', newValue); this.$emit('selected-items-changed', newValue);
} }
}, },
isInitialized(newValue) { isInitialized(newValue) {
if (newValue) { if (newValue) {
this.$emit('isInitialized'); this.$emit('is-initialized');
} }
}, },
currentComponentState(newValue, oldValue) { currentComponentState(newValue, oldValue) {
@ -168,7 +168,7 @@ let PillarTable = Vue.component('pillar-table-base', {
// Deep compare to avoid spamming un needed events // Deep compare to avoid spamming un needed events
let hasChanged = JSON.stringify(newValue ) !== JSON.stringify(oldValue); let hasChanged = JSON.stringify(newValue ) !== JSON.stringify(oldValue);
if (hasChanged) { if (hasChanged) {
this.$emit('componentStateChanged', newValue); this.$emit('component-state-changed', newValue);
} }
} }
} }

10
src/scripts/js/es6/common/vuecomponents/table/columns/filter/ColumnFilter.js
View File

@ -56,8 +56,8 @@ class ComponentState {
/** /**
* Component to select what columns to render in the table. * Component to select what columns to render in the table.
* *
* @emits visibleColumnsChanged(columns) When visible columns has changed * @emits visible-columns-changed(columns) When visible columns has changed
* @emits componentStateChanged(newState) When column filter state changed. * @emits component-state-changed(newState) When column filter state changed.
*/ */
let Filter = Vue.component('pillar-table-column-filter', { let Filter = Vue.component('pillar-table-column-filter', {
template: TEMPLATE, template: TEMPLATE,
@ -85,14 +85,14 @@ let Filter = Vue.component('pillar-table-column-filter', {
this.columnStates = this.createInitialColumnStates(); this.columnStates = this.createInitialColumnStates();
}, },
visibleColumns(visibleColumns) { visibleColumns(visibleColumns) {
this.$emit('visibleColumnsChanged', visibleColumns); this.$emit('visible-columns-changed', visibleColumns);
}, },
columnFilterState(newValue) { columnFilterState(newValue) {
this.$emit('componentStateChanged', newValue); this.$emit('component-state-changed', newValue);
} }
}, },
created() { created() {
this.$emit('visibleColumnsChanged', this.visibleColumns); this.$emit('visible-columns-changed', this.visibleColumns);
}, },
methods: { methods: {
createInitialColumnStates() { createInitialColumnStates() {

8
src/scripts/js/es6/common/vuecomponents/table/rows/filter/EnumFilter.js
View File

@ -56,7 +56,7 @@ class ComponentState {
* Filter row objects based on enumeratable values. * Filter row objects based on enumeratable values.
* *
* @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed. * @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed.
* @emits componentStateChanged(newState) When row filter state changed. * @emits component-state-changed(newState) When row filter state changed.
*/ */
let EnumFilter = { let EnumFilter = {
template: TEMPLATE, template: TEMPLATE,
@ -107,14 +107,14 @@ let EnumFilter = {
}, },
watch: { watch: {
visibleRowObjects(visibleRowObjects) { visibleRowObjects(visibleRowObjects) {
this.$emit('visibleRowObjectsChanged', visibleRowObjects); this.$emit('visible-row-objects-changed', visibleRowObjects);
}, },
currentComponentState(newValue) { currentComponentState(newValue) {
this.$emit('componentStateChanged', newValue); this.$emit('component-state-changed', newValue);
} }
}, },
created() { created() {
this.$emit('visibleRowObjectsChanged', this.visibleRowObjects); this.$emit('visible-row-objects-changed', this.visibleRowObjects);
}, },
methods: { methods: {
shouldBeVisible(rowObject) { shouldBeVisible(rowObject) {

6
src/scripts/js/es6/common/vuecomponents/table/rows/filter/NameFilter.js
View File

@ -6,15 +6,15 @@ const TEMPLATE =`
:componentState="componentState" :componentState="componentState"
:rowObjects="rowObjects" :rowObjects="rowObjects"
:valueExtractorCB="extractName" :valueExtractorCB="extractName"
@visibleRowObjectsChanged="$emit('visibleRowObjectsChanged', ...arguments)" @visible-row-objects-changed="$emit('visible-row-objects-changed', ...arguments)"
@componentStateChanged="$emit('componentStateChanged', ...arguments)" @component-state-changed="$emit('component-state-changed', ...arguments)"
/> />
`; `;
/** /**
* Filter row objects based on there name. * Filter row objects based on there name.
* *
* @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed. * @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed.
* @emits componentStateChanged(newState) When row filter state changed. * @emits component-state-changed(newState) When row filter state changed.
*/ */
let NameFilter = { let NameFilter = {
template: TEMPLATE, template: TEMPLATE,

4
src/scripts/js/es6/common/vuecomponents/table/rows/filter/RowFilter.js
View File

@ -5,8 +5,8 @@ const TEMPLATE =`
<name-filter <name-filter
:rowObjects="rowObjects" :rowObjects="rowObjects"
:componentState="componentState" :componentState="componentState"
@visibleRowObjectsChanged="$emit('visibleRowObjectsChanged', ...arguments)" @visible-row-objects-changed="$emit('visible-row-objects-changed', ...arguments)"
@componentStateChanged="$emit('componentStateChanged', ...arguments)" @component-state-changed="$emit('component-state-changed', ...arguments)"
/> />
</div> </div>
`; `;

6
src/scripts/js/es6/common/vuecomponents/table/rows/filter/StatusFilter.js
View File

@ -7,15 +7,15 @@ const TEMPLATE =`
:componentState="componentState" :componentState="componentState"
:rowObjects="rowObjects" :rowObjects="rowObjects"
:valueExtractorCB="extractStatus" :valueExtractorCB="extractStatus"
@visibleRowObjectsChanged="$emit('visibleRowObjectsChanged', ...arguments)" @visible-row-objects-changed="$emit('visible-row-objects-changed', ...arguments)"
@componentStateChanged="$emit('componentStateChanged', ...arguments)" @component-state-changed="$emit('component-state-changed', ...arguments)"
/> />
`; `;
/** /**
* Filter row objects based on there status. * Filter row objects based on there status.
* *
* @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed. * @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed.
* @emits componentStateChanged(newState) When row filter state changed. * @emits component-state-changed(newState) When row filter state changed.
*/ */
let StatusFilter = { let StatusFilter = {
template: TEMPLATE, template: TEMPLATE,

8
src/scripts/js/es6/common/vuecomponents/table/rows/filter/TextFilter.js
View File

@ -21,7 +21,7 @@ class ComponentState {
* Component to filter rowobjects by a text value * Component to filter rowobjects by a text value
* *
* @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed. * @emits visibleRowObjectsChanged(rowObjects) When the objects to be visible has changed.
* @emits componentStateChanged(newState) When row filter state changed. Filter query... * @emits component-state-changed(newState) When row filter state changed. Filter query...
*/ */
let TextFilter = { let TextFilter = {
template: TEMPLATE, template: TEMPLATE,
@ -67,14 +67,14 @@ let TextFilter = {
}, },
watch: { watch: {
visibleRowObjects(visibleRowObjects) { visibleRowObjects(visibleRowObjects) {
this.$emit('visibleRowObjectsChanged', visibleRowObjects); this.$emit('visible-row-objects-changed', visibleRowObjects);
}, },
currentComponentState(newValue) { currentComponentState(newValue) {
this.$emit('componentStateChanged', newValue); this.$emit('component-state-changed', newValue);
} }
}, },
created() { created() {
this.$emit('visibleRowObjectsChanged', this.visibleRowObjects); this.$emit('visible-row-objects-changed', this.visibleRowObjects);
}, },
methods: { methods: {
filterByText(rowObject) { filterByText(rowObject) {