<script>
import {mapGetters, mapActions, mapMutations} from "vuex"
import Tabulator from "@molecules/VTabulator/VTabulator.vue"

export default {
  name: 'TableComponent',
  components: {Tabulator},
  data () {
    
    return {
    }
  },
  computed: {
    ...mapGetters('layout_machines', ['tableData', 'pagination']),
    tabulatorOtps() {
      return {
        dataSource: this.tableData,
        pagination: {...this.pagination, updatePagination: this.updatePagination},
        columns: 
        [
          {
            title: "Тип и № машины",
            field: "machine_type",
            width: 150,
            log: true,
            render: `<div class="flex items-center gap-2">
                      <a target="_blank" class="underline decoration-dashed" href="/html/askr_devices/analyze_machine/{{ machine_id }}">{{machine_type}}</i></a>
                    </div>`
          },
          {
            title: "Imei",
            field: "imei",
            width: 150,
            log: true,
            render: `<div class="flex items-center gap-2">
                      <a target="_blank" class="underline decoration-dashed" href="/html/askr_devices/analyze_comm/{{ imei }}">{{imei}}</i></a>
                    </div>`
          },
          {
            title: "Дорога",
            field: "railway_name",
            width: 90
          },
          {
            title: "Предприятие",
            field: "org_name",
            width: 150
          },
          {
            title: "КР устройства",
            field: "device_number",
            width: 120,
            log: true,
            render: `<div class="flex items-center gap-2">
                      <a target="_blank" class="underline decoration-dashed" href="/html/askr_devices/analyze_device/{{ device_number }}">{{device_number}}</i></a>
                    </div>`
          },
          {
            title: "Номер",
            field: "nomer_zn8",
            width: 90
          },
          {
            title: "Заводской номер",
            field: "zav_nomer",
            width: 90
          },
          {
            title: "ID машины",
            field: "machine_id",
            width: 90
          },
          {
            title: "ID устройства",
            field: "device_id",
            width: 90
          }
        ],
        height: "550px"
      }
    }
  },
  methods: {
    ...mapMutations('layout_machines', ['setHistoryData']),
    ...mapActions('layout_machines', ['updatePagination']),
  }
}

</script>

<template>
  <Tabulator v-bind="tabulatorOtps" />
</template>