Сортировать таблицу vue по датам после загрузки данных - PullRequest
0 голосов
/ 26 ноября 2018

Мне нужна справочная таблица сортировки по столбцу даты по умолчанию.Сейчас кажется, что таблица отсортирована, а затем данные загружаются.Когда я нажимаю на заголовок таблицы дат, он переворачивает стрелку сортировки в заголовке, но не на данные.Когда я нажимаю еще раз, данные тоже меняются местами.

Вот мой текущий файл .vue:

<template>
  <div class="hello">
      <div>
        <md-table v-model="searched" md-card md-fixed-header md-sort="LatestCall" md-sort-order="asc">
          <md-table-toolbar>
            <h1 class="md-title">Overvågning</h1>
            <md-field md-clearable class="md-toolbar-section-end">
              <md-input placeholder="Søg efter Navn..." v-model="search" @input="searchOnTable" />
            </md-field>
          </md-table-toolbar>

          <md-table-empty-state
            md-label="Ingen resultater"
            :md-description="`Ingen resultater '${search}'.`">
          </md-table-empty-state>

          <md-table-row slot="md-table-row" slot-scope="{ item }">
            <md-table-cell md-label="Lokal nummer" md-sort-by="LocalNumber" md-numeric>{{ item.LocalNumber }}</md-table-cell>
            <md-table-cell md-label="Seneste kald" md-sort-by="LatestCall"> {{moment(item.LatestCall).format('DD/MM/YYYY HH:MM:ss')}} </md-table-cell>
            <md-table-cell md-label="Navn" md-sort-by="Name">{{ item.Name }}</md-table-cell>
            <md-table-cell md-label="Beskrivelse" md-sort-by="Description">{{ item.Description }}</md-table-cell>
            <md-table-cell md-label="A-Nummer" md-sort-by="ANumber">{{ item.ANumber }}</md-table-cell>
            <md-table-cell md-label="B-Nummer" md-sort-by="BNumber">{{ item.BNumber }}</md-table-cell>
            <md-table-cell md-label="Lokal Nummer" md-sort-by="PhoneLocalNumber">{{ item.PhoneLocalNumber }}</md-table-cell>
          </md-table-row>
        </md-table>
      </div>
  </div>
</template>



<script>

  const toLower = text => {
    return text.toString().toLowerCase()
  }

  const searchByName = (data, term) => {
      data = data.filter(item => toLower(item.Name).includes(toLower(term)))
      return data
  }

import axios from 'axios'
export default {
  name: 'elevators',
  data() {
    return {
      phones: [],
      searched: [],
      search: null
    }
  },
  methods: {
      searchOnTable () {
        this.searched = searchByName(this.phones, this.search)
      },
  },
  created() {
    axios
      .get('http://172.31.12.227/6773/GetLatestCallForeachEmp.php')
      .then(response => {
        this.phones = response.data
        this.searched = response.data
      })
  }
}
</script>   

Надеюсь, кто-нибудь может дать мне подсказку?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...