hide manual sort buttons

pull/35/head
Ondřej Hruška 6 years ago
parent 9ca3b93847
commit 4570239548
Signed by: MightyPork
GPG Key ID: 2C5FD5035250423D
  1. 38
      resources/assets/js/components/ColumnEditor.vue
  2. 1
      resources/views/table/create.blade.php

@ -8,7 +8,7 @@ Complex animated column editor for the table edit page
<table class="editor-table"> <table class="editor-table">
<thead> <thead>
<tr> <tr>
<th v-if="doSort"></th> <th v-if="sortable"></th>
<th>Name</th> <th>Name</th>
<th>Type</th> <th>Type</th>
<th>Title</th> <th>Title</th>
@ -19,17 +19,18 @@ Complex animated column editor for the table edit page
</thead> </thead>
<transition-group name="col-list" tag="tbody" ref="col-list"> <transition-group name="col-list" tag="tbody" ref="col-list">
<tr v-for="(col, i) in columns" :key="col.id" :ref="'col' + i" :class="{dragging: col._dragging}"> <tr v-for="(col, i) in columns" :key="col.id" :ref="'col' + i" :class="{dragging: col._dragging}">
<td class="btn-group" v-if="doSort"> <td class="btn-group" v-if="sortable">
<button class="btn btn-outline-secondary drag-btn" @mousedown="beginDrag(i, $event)"> <button type="button" class="btn btn-outline-secondary drag-btn" @mousedown="beginDrag(i, $event)">
<v-icon class="fa-bars" alt="Drag" /> <v-icon class="fa-bars" alt="Drag" />
</button> </button><!--
<a href="" :class="['btn', 'btn-outline-secondary', {disabled: i==0}]" --><button type="button" :class="['btn', 'btn-outline-secondary', {disabled: i==0}]" v-if="manualSort"
@click.prevent="move(i, -1)"> @click.prevent="move(i, -1)">
<v-icon class="fa-chevron-up" alt="Move Up" /> <v-icon class="fa-chevron-up" alt="Move Up" />
</a><a href="" :class="['btn', 'btn-outline-secondary', {disabled: i == (columns.length-1)}]" </button><!--
--><button type="button" :class="['btn', 'btn-outline-secondary', {disabled: i == (columns.length-1)}]" v-if="manualSort"
@click.prevent="move(i, 1)"> @click.prevent="move(i, 1)">
<v-icon class="fa-chevron-down" alt="Move Down" /> <v-icon class="fa-chevron-down" alt="Move Down" />
</a> </button>
</td> </td>
<td> <td>
@ -58,26 +59,26 @@ Complex animated column editor for the table edit page
</td> </td>
<td v-if="!newTable"> <td v-if="!newTable">
<a href="" :class="['btn', col._dirty ? 'btn-info' : 'btn-outline-secondary']" <button type="button" :class="['btn', col._dirty ? 'btn-info' : 'btn-outline-secondary']"
@click.prevent="saveCol(i)"> @click.prevent="saveCol(i)">
<v-icon class="fa-save" alt="Save" /> <v-icon class="fa-save" alt="Save" />
</a> </button>
</td> </td>
<td> <td>
<a href="" :class="delBtnClass(col)" <button type="button" :class="delBtnClass(col)"
@click.prevent="toggleColDelete(i)"> @click.prevent="toggleColDelete(i)">
<v-icon :class="col._remove ? 'fa-undo' : 'fa-trash-o'" <v-icon :class="col._remove ? 'fa-undo' : 'fa-trash-o'"
:alt="col._remove ? 'Undo Remove' : 'Remove'" /> :alt="col._remove ? 'Undo Remove' : 'Remove'" />
</a> </button>
</td> </td>
<td> <td>
<a href="" :class="['btn', 'btn-outline-secondary']" <button type="button" :class="['btn', 'btn-outline-secondary']"
v-if="i === columns.length - 1" v-if="i === columns.length - 1"
@click.prevent="addCol()"> @click.prevent="addCol()">
<v-icon class="fa-plus" alt="Add Column" /> <v-icon class="fa-plus" alt="Add Column" />
</a> </button>
</td> </td>
</tr> </tr>
</transition-group> </transition-group>
@ -155,11 +156,12 @@ import { query } from './table-editor-utils'
export default { export default {
props: { props: {
route: { type: String, default: null }, route: { type: String, default: null },
doSort: { type: Boolean, default: true }, sortable: { type: Boolean, default: true },
newTable: { type: Boolean, default: false }, manualSort: { type: Boolean, default: false },
name: { type: String, required: true }, newTable: { type: Boolean, default: false },
xColumns: { type: Array, required: true }, name: { type: String, required: true },
xColumns: { type: Array, required: true },
}, },
data: function () { data: function () {
return { return {

@ -81,7 +81,6 @@
name: 'columns', name: 'columns',
xColumns: {!! old('columns', toJSON($columns)) !!}, xColumns: {!! old('columns', toJSON($columns)) !!},
newTable: true, newTable: true,
doSort: false,
}) })
}); });
</script> </script>

Loading…
Cancel
Save