<template>
  <img ref="logo" :src="url + '/api/public/applogo.png'" alt="LOGO" class="h-full w-auto" />
</template>

<script setup lang="ts">
import { url } from "@/serverCom";
import { useSettingStore } from "@/stores/admin/management/setting";
import { mapState } from "pinia";
import { defineComponent } from "vue";
</script>

<script lang="ts">
export default defineComponent({
  watch: {
    logo() {
      (this.$refs.logo as HTMLImageElement).src = url + "/api/public/applogo.png?t=" + new Date().getTime();
    },
  },
  computed: {
    ...mapState(useSettingStore, ["readSetting"]),
    logo() {
      return this.readSetting("club.logo");
    },
  },
});
</script>
