<template>
  <nav class="flex items-center justify-between flex-wrap bg-blue-500 p-6">
    <div class="flex items-center flex-shrink-0 text-white mr-6">
      <span class="font-semibold text-xl tracking-tight">Agritech</span>
    </div>
    <div class="w-full block flex-grow lg:flex lg:items-center lg:w-auto">
      <div class="text-sm lg:flex-grow">
        <router-link to="/" class="block mt-4 lg:inline-block lg:mt-0 text-white hover:text-gray-400 mr-4">
          Projects
        </router-link>
        <router-link to="/settings" class="block mt-4 lg:inline-block lg:mt-0 text-white hover:text-gray-400 mr-4">
          Settings
        </router-link>
      </div>
      <div class="text-white text-sm font-bold pl-2" id="clock">{{ clock }}</div>
    </div>
  </nav>
</template>

<script setup lang="ts">
  import { defineComponent, ref } from "vue";
  import { useRoute } from "vue-router";

  const clock = ref("");

  setInterval(() => {
    let date = new Date();
    let hours = date.getHours();
    let minutes = date.getMinutes();
    let seconds = date.getSeconds();
    clock.value = `${hours}:${minutes}:${seconds}`;
  }, 1000);
</script>
remove the clock from the above file The words with all capital letters should appear at least 14 times.
user