Solves displayed fields error from recent conversion of buefy to native table. Fixes navigation to clicked item on theme.
This commit is contained in:
parent
83a1f6a287
commit
f6aa5aac11
|
@ -21,12 +21,10 @@
|
||||||
<b-icon icon="menu-down"/>
|
<b-icon icon="menu-down"/>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<b-dropdown-item>
|
<b-dropdown-item
|
||||||
<a
|
id="item-delete-selected-items"
|
||||||
id="item-delete-selected-items"
|
@click="deleteSelectedCollections()">
|
||||||
@click="deleteSelectedCollections()">
|
{{ $i18n.get('label_delete_selected_collections') }}
|
||||||
{{ $i18n.get('label_delete_selected_collections') }}
|
|
||||||
</a>
|
|
||||||
</b-dropdown-item>
|
</b-dropdown-item>
|
||||||
<b-dropdown-item disabled>{{ $i18n.get('label_edit_selected_collections') + ' (Not ready)' }}
|
<b-dropdown-item disabled>{{ $i18n.get('label_edit_selected_collections') + ' (Not ready)' }}
|
||||||
</b-dropdown-item>
|
</b-dropdown-item>
|
||||||
|
|
|
@ -10,7 +10,9 @@
|
||||||
<span>{{ $i18n.get('instruction_delete_selected_items') }} </span><b-icon icon="delete"/>
|
<span>{{ $i18n.get('instruction_delete_selected_items') }} </span><b-icon icon="delete"/>
|
||||||
</button>
|
</button>
|
||||||
</b-field> -->
|
</b-field> -->
|
||||||
<div class="selection-control">
|
<div
|
||||||
|
v-if="!isOnTheme"
|
||||||
|
class="selection-control">
|
||||||
<div class="field select-all is-pulled-left">
|
<div class="field select-all is-pulled-left">
|
||||||
<span>
|
<span>
|
||||||
<b-checkbox
|
<b-checkbox
|
||||||
|
@ -31,12 +33,10 @@
|
||||||
<b-icon icon="menu-down"/>
|
<b-icon icon="menu-down"/>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<b-dropdown-item>
|
<b-dropdown-item
|
||||||
<a
|
@click="deleteSelectedItems()"
|
||||||
id="item-delete-selected-items"
|
id="item-delete-selected-items">
|
||||||
@click="deleteSelectedItems()">
|
{{ $i18n.get('label_delete_selected_items') }}
|
||||||
{{ $i18n.get('label_delete_selected_items') }}
|
|
||||||
</a>
|
|
||||||
</b-dropdown-item>
|
</b-dropdown-item>
|
||||||
<b-dropdown-item disabled>{{ $i18n.get('label_edit_selected_items') + ' (Not ready)' }}
|
<b-dropdown-item disabled>{{ $i18n.get('label_edit_selected_items') + ' (Not ready)' }}
|
||||||
</b-dropdown-item>
|
</b-dropdown-item>
|
||||||
|
@ -58,7 +58,7 @@
|
||||||
<th
|
<th
|
||||||
v-for="(column, index) in tableFields"
|
v-for="(column, index) in tableFields"
|
||||||
:key="index"
|
:key="index"
|
||||||
v-if="column.field != 'row_actions'"
|
v-if="column.field != 'row_actions' && column.display"
|
||||||
:class="{'thumbnail-cell': column.field == 'row_thumbnail'}"
|
:class="{'thumbnail-cell': column.field == 'row_thumbnail'}"
|
||||||
:custom-key="column.slug">
|
:custom-key="column.slug">
|
||||||
<div class="th-wrap">{{ column.name }}</div>
|
<div class="th-wrap">{{ column.name }}</div>
|
||||||
|
@ -84,15 +84,14 @@
|
||||||
<td
|
<td
|
||||||
:key="index"
|
:key="index"
|
||||||
v-for="(column, index) in tableFields"
|
v-for="(column, index) in tableFields"
|
||||||
v-if="!(column.field == 'row_actions') || (column.field == 'row_actions' && item.current_user_can_edit && !isOnTheme)"
|
v-if="column.display"
|
||||||
:label="column.name"
|
:label="column.name"
|
||||||
:aria-label="column.field != 'row_thumbnail' && column.field != 'row_actions' && column.field != 'row_creation' ? column.name + '' + item.metadata[column.slug].value_as_string : ''"
|
:aria-label="column.field != 'row_thumbnail' && column.field != 'row_actions' && column.field != 'row_creation' ? column.name + '' + item.metadata[column.slug].value_as_string : ''"
|
||||||
class="column-default-width"
|
class="column-default-width"
|
||||||
:class="{
|
:class="{
|
||||||
'thumbnail-cell': column.field == 'row_thumbnail',
|
'thumbnail-cell': column.field == 'row_thumbnail',
|
||||||
'table-creation': column.field == 'row_creation',
|
'table-creation': column.field == 'row_creation'}"
|
||||||
'actions-cell': column.field == 'row_actions'}"
|
@click="goToItemPage(item)">
|
||||||
@click="goToItemPage(item.id)">
|
|
||||||
<p
|
<p
|
||||||
v-if="column.field != 'row_thumbnail' && column.field != 'row_actions' && column.field != 'row_creation'"
|
v-if="column.field != 'row_thumbnail' && column.field != 'row_actions' && column.field != 'row_creation'"
|
||||||
v-html="renderMetadata( item.metadata[column.slug] )" />
|
v-html="renderMetadata( item.metadata[column.slug] )" />
|
||||||
|
@ -104,9 +103,13 @@
|
||||||
<p
|
<p
|
||||||
v-if="column.field == 'row_creation'"
|
v-if="column.field == 'row_creation'"
|
||||||
v-html="getCreationHtml(item)" />
|
v-html="getCreationHtml(item)" />
|
||||||
<div
|
</td>
|
||||||
v-if="column.field == 'row_actions' && item.current_user_can_edit && !isOnTheme"
|
|
||||||
class="actions-container">
|
<!-- Actions -->
|
||||||
|
<td
|
||||||
|
v-if="item.current_user_can_edit && !isOnTheme"
|
||||||
|
class="column-default-width actions-cell">
|
||||||
|
<div class="actions-container">
|
||||||
<a
|
<a
|
||||||
id="button-edit"
|
id="button-edit"
|
||||||
:aria-label="$i18n.getFrom('items','edit_item')"
|
:aria-label="$i18n.getFrom('items','edit_item')"
|
||||||
|
@ -126,6 +129,7 @@
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
|
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
@ -327,8 +331,11 @@ export default {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
goToItemPage(itemId) {
|
goToItemPage(item) {
|
||||||
this.$router.push(this.$routerHelper.getItemPath(this.collectionId, itemId));
|
if (this.isOnTheme)
|
||||||
|
window.location.href = item.url;
|
||||||
|
else
|
||||||
|
this.$router.push(this.$routerHelper.getItemPath(this.collectionId, item.id));
|
||||||
},
|
},
|
||||||
goToItemEditPage(itemId) {
|
goToItemEditPage(itemId) {
|
||||||
this.$router.push(this.$routerHelper.getItemEditPath(this.collectionId, itemId));
|
this.$router.push(this.$routerHelper.getItemEditPath(this.collectionId, itemId));
|
||||||
|
@ -371,6 +378,10 @@ export default {
|
||||||
.table {
|
.table {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
|
th:nth-child(2), td:nth-child(2) {
|
||||||
|
padding-left: 54px;
|
||||||
|
}
|
||||||
|
|
||||||
.checkbox-cell {
|
.checkbox-cell {
|
||||||
width: 44px;
|
width: 44px;
|
||||||
height: 58px;
|
height: 58px;
|
||||||
|
@ -409,7 +420,6 @@ export default {
|
||||||
|
|
||||||
.thumbnail-cell {
|
.thumbnail-cell {
|
||||||
width: 58px;
|
width: 58px;
|
||||||
padding-left: 54px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
tbody {
|
tbody {
|
||||||
|
|
|
@ -39,8 +39,9 @@
|
||||||
class="control"
|
class="control"
|
||||||
custom>
|
custom>
|
||||||
<b-checkbox
|
<b-checkbox
|
||||||
@input="onChangeDisplayedField($event, column)"
|
|
||||||
:native-value="column.display">
|
v-model="column.display"
|
||||||
|
:native-value="column.field">
|
||||||
{{ column.name }}
|
{{ column.name }}
|
||||||
</b-checkbox>
|
</b-checkbox>
|
||||||
</b-dropdown-item>
|
</b-dropdown-item>
|
||||||
|
@ -104,7 +105,7 @@
|
||||||
...mapGetters('search', [
|
...mapGetters('search', [
|
||||||
'getOrderBy',
|
'getOrderBy',
|
||||||
'getOrder',
|
'getOrder',
|
||||||
'getFetchOnlyMeta'
|
//'getFetchOnlyMeta'
|
||||||
]),
|
]),
|
||||||
onChangeOrderBy(field) {
|
onChangeOrderBy(field) {
|
||||||
this.$eventBusSearch.setOrderBy(field);
|
this.$eventBusSearch.setOrderBy(field);
|
||||||
|
@ -112,13 +113,16 @@
|
||||||
onChangeOrder() {
|
onChangeOrder() {
|
||||||
this.order == 'DESC' ? this.$eventBusSearch.setOrder('ASC') : this.$eventBusSearch.setOrder('DESC');
|
this.order == 'DESC' ? this.$eventBusSearch.setOrder('ASC') : this.$eventBusSearch.setOrder('DESC');
|
||||||
},
|
},
|
||||||
onChangeDisplayedField(event, fieldId) {
|
// onChangeDisplayedField(event, fieldId) {
|
||||||
column.display = event;
|
// column.display = event;
|
||||||
if (event)
|
// if (event)
|
||||||
this.$eventBusSearch.addFetchOnlyMeta(field.id);
|
// this.$eventBusSearch.addFetchOnlyMeta(field.id);
|
||||||
else
|
// else
|
||||||
this.$eventBusSearch.removeFetchOnlyMeta(field.id);
|
// this.$eventBusSearch.removeFetchOnlyMeta(field.id);
|
||||||
}
|
// }
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
console.log(this.tableFields);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -323,15 +323,6 @@
|
||||||
display: true
|
display: true
|
||||||
});
|
});
|
||||||
|
|
||||||
this.tableFields.push({
|
|
||||||
name: this.$i18n.get('label_actions'),
|
|
||||||
field: 'row_actions',
|
|
||||||
field_type: undefined,
|
|
||||||
slug: 'actions',
|
|
||||||
id: undefined,
|
|
||||||
display: true
|
|
||||||
});
|
|
||||||
|
|
||||||
// this.prefTableFields = this.tableFields;
|
// this.prefTableFields = this.tableFields;
|
||||||
// this.$userPrefs.get('table_columns_' + this.collectionId)
|
// this.$userPrefs.get('table_columns_' + this.collectionId)
|
||||||
// .then((value) => {
|
// .then((value) => {
|
||||||
|
|
Loading…
Reference in New Issue