made single row selectable, id copied on select

Author: McClunatic

package-lock.json

@@ -22,6 +22,7 @@
     "v-calendar": "^1.0.0-beta.22",
     "vue": "^2.6.10",
     "vue-axios": "^2.1.5",
+    "vue-clipboard2": "^0.3.1",
     "vue-router": "^3.0.3",
     "vuex": "^3.0.1"
   },

package.json

@@ -4,6 +4,9 @@
       striped
       hover
       responsive
+      selectable
+      select-mode="single"
+      @row-selected="handleSelectRow"
       :fields="fields"
       :items="kills"
       :filter="filters"
@@ -255,6 +258,9 @@ export default {
     clearDate: function(field) {
       Vue.set(this.filters, field, { start: null, end: null });
     },
+    handleSelectRow: function(rows) {
+      this.$copyText(rows[0].id.text);
+    },
     handleDateShow: function(field) {
       let start = this.filters[field].start;
       let end = this.filters[field].end;

src/components/Trophies.vue

@@ -26,6 +26,7 @@ import {
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import "typeface-press-start-2p";
 import VCalendar from "v-calendar";
+import VueClipboard from "vue-clipboard2";
 
 library.add(
   faCrosshairs,
@@ -45,6 +46,7 @@ Vue.component("font-awesome-icon", FontAwesomeIcon);
 
 Vue.use(VueAxios, axios);
 Vue.use(VCalendar);
+Vue.use(VueClipboard);
 
 Vue.config.productionTip = false;