<template>
  <WidgetShell title="Quick links" icon="mdi-link-variant" :editing="editing" @refresh="() => {}" @remove="$emit('remove')">
    <div class="link-grid">
      <v-btn v-for="l in links" :key="l.view" variant="tonal" size="small" :prepend-icon="l.icon" class="justify-start" @click="go(l.view)">{{ l.label }}</v-btn>
    </div>
  </WidgetShell>
</template>
<script>
import WidgetShell from './WidgetShell.vue';
export default {
  components: { WidgetShell },
  inject: { dashboardNavigate: { default: null } },
  props: { token: { type: String, required: true }, editing: { type: Boolean, default: false }, config: { type: Object, default: () => ({}) } },
  emits: ['remove'],
  data() {
    return {
      links: [
        { label: 'Assets', view: 'assets', icon: 'mdi-archive-outline' },
        { label: 'Scan', view: 'scan', icon: 'mdi-barcode-scan' },
        { label: 'Maintenance', view: 'pm', icon: 'mdi-wrench-outline' },
        { label: 'Reports', view: 'reports', icon: 'mdi-chart-bar' },
        { label: 'Period Close', view: 'close', icon: 'mdi-calendar-lock' },
        { label: 'Contacts', view: 'contacts', icon: 'mdi-card-account-details-outline' }
      ]
    };
  },
  methods: { go(view) { if (this.dashboardNavigate) this.dashboardNavigate(view); } }
};
</script>
<style scoped>
.link-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; }
</style>
