other components...

src/views/admin/TableOnlyView/index.ts

@@ -0,0 +1 @@
+export {default as tableOnlyView} from './tableOnlyView.vue'

src/views/admin/TableOnlyView/tableOnlyView.ts

@@ -0,0 +1,59 @@
+
+@Component({})
+export default class TableOnlyView extends Vue {
+  public loading: boolean = false
+
+  public serverPagination: {
+    page: number,
+    rowsNumber: number // specifying this determines pagination is server-side
+  } = {page: 1, rowsNumber: 10}
+
+  public serverData: any [] = []
+
+  public columns: any[] = [
+    {
+      name: 'chiave',
+      required: true,
+      label: 'Chiave',
+      align: 'left',
+      field: 'chiave',
+      sortable: true,
+    },
+    { name: 'valore', label: 'Valore', field: 'valore', sortable: false },
+  ]
+
+  public filter: string = ''
+
+  public selected: any[] = []
+
+  public request(props) {
+    this.loading = true
+    setTimeout(() => {
+      this.serverPagination = props.pagination
+      let table = this.$refs.table,
+        rows = GlobalStore.state.cfgServer.slice(),
+        { page, rowsPerPage, sortBy, descending } = props.pagination
+
+      // if (props.filter) {
+      //   rows = table.filterMethod(rows, props.filter)
+      // }
+      // if (sortBy) {
+      //   rows = table.sortMethod(rows, sortBy, descending)
+      // }
+
+      this.serverPagination.rowsNumber = rows.length
+      if (rowsPerPage) {
+        rows = rows.slice((page - 1) * rowsPerPage, page * rowsPerPage)
+      }
+      this.serverData = rows
+      this.loading = false
+    }, 1500)
+  }
+
+  public mounted() {
+    this.request({
+      pagination: this.serverPagination,
+      filter: this.filter,
+    })
+  }
+}

src/views/admin/TableOnlyView/tableOnlyView.vue

@@ -0,0 +1,29 @@
+<template>
+    <q-page padding class="docs-table">
+        <p class="caption">TableOnlyView</p>
+        <q-table
+                ref="table"
+                color="primary"
+                title="Parametri di Configurazione Server"
+                :data="serverData"
+                :columns="columns"
+                :filter="filter"
+                selection="multiple"
+                v-model:selected="selected"
+                row-key="chiave"
+                v-model:pagination="serverPagination"
+                @request="request"
+                :loading="loading"
+        >
+            <template v-slot:top-right="props" >
+                <q-search hide-underline v-model="filter" />
+            </template>
+        </q-table>
+    </q-page>
+</template>
+<script lang="ts" src="tableOnlyView.ts">
+</script>
+
+<style lang="scss" scoped>
+    @import 'tableOnlyView';
+</style>