<!--
  -
  - Copyright (c) 2025. Jeffery Hsu - Achievement Report Generator
  -
  - This program is free software: you can redistribute it and/or modify
  - it under the terms of the GNU General Public License as published by
  - the Free Software Foundation, either version 3 of the License, or
  - (at your option) any later version.
  -
  - This program is distributed in the hope that it will be useful,
  - but WITHOUT ANY WARRANTY; without even the implied warranty of
  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  - GNU General Public License for more details.
  -
  - You should have received a copy of the GNU General Public License
  - along with this program. If not, see <https://www.gnu.org/licenses/>.
  -
  -->

<script setup lang="ts">
import { onMounted, ref } from 'vue'
import { emitter } from '@renderer/utils/mitt'
import router from '@renderer/router'
import { useGlobalStore } from '@renderer/store'
import { storeToRefs } from 'pinia'
import { House, User, EditPen, MessageBox, CircleCheck, Compass } from '@element-plus/icons-vue'
import SvgGnuLogo from '@renderer/components/svg/SvgGnuLogo.vue'

const store = useGlobalStore()
const { courseInfo } = storeToRefs(store)

const asideMenu = [
  { title: '课程信息', route: 'panelIndex', icon: House },
  { title: '学生管理', route: 'panelStudent', icon: User },
  { title: '成绩录入', route: 'panelScore', icon: EditPen },
  { title: '录入试卷', route: 'panelPaper', icon: MessageBox },
  { title: '完成导出', route: 'panelFinal', icon: CircleCheck }
]
const currentActiveIndex = ref(0)
const expendMenu = ref(false)
const showAbout = ref(false)

const handleMenuItemClick = (idx: number) => {
  currentActiveIndex.value = idx
  router.push({ name: asideMenu[idx].route })
}

const handleMenuExpend = () => (expendMenu.value = !expendMenu.value)
const handleShowAbout = () => (showAbout.value = true)

onMounted(() => {
  emitter.emit('titleBarShow', ['save'])
  if (courseInfo.value === null) {
    router.push({ name: 'start' })
  }
})
</script>

<template>
  <div class="flex w-full bg-white/75">
    <aside
      class="h-full w-15 shrink-0 overflow-hidden transition-all ease-in-out max-w-60 text-nowrap relative"
      :class="{ 'w-full': expendMenu }"
    >
      <div
        class="m-2 flex h-11 w-11 flex-col items-center justify-center gap-1 rounded-md transition-all group hover:bg-gray-400/20"
        @click="handleMenuExpend"
      >
        <div class="w-4 border-b transition-all group-active:w-2.5" />
        <div class="w-4 border-b transition-all group-active:w-2.5" />
        <div class="w-4 border-b transition-all group-active:w-2.5" />
      </div>
      <div
        v-for="(item, index) in asideMenu"
        :key="index"
        class="relative m-2 flex h-11 cursor-pointer items-center overflow-hidden rounded-lg transition-all text hover:bg-gray-400/20"
        :class="{ 'bg-gray-400/20': currentActiveIndex === index }"
        @click="handleMenuItemClick(index)"
      >
        <div
          v-show="currentActiveIndex === index"
          class="absolute top-3 bottom-3 left-0 w-1 rounded-full bg-blue-500"
        />
        <el-icon :size="20" class="mx-3"><component :is="item.icon" /></el-icon>
        <p>{{ item.title }}</p>
      </div>

      <div
        class="absolute m-2 flex h-11 cursor-pointer items-center overflow-hidden rounded-lg transition-all text hover:bg-gray-400/20 left-0 right-0 bottom-0"
        @click="handleShowAbout"
      >
        <el-icon :size="20" class="mx-3"><Compass /></el-icon>
        <p>关于</p>
      </div>
    </aside>
    <router-view
      class="grow overflow-y-scroll rounded-tl-lg border-t border-l border-gray-300 bg-white shadow-lg no-scrollbar"
    />
    <el-dialog v-model="showAbout" title="关于本软件" width="500">
      <svg-gnu-logo />
      <p>
        本软件基于<a
          class="cursor-pointer text-blue-600"
          href="https://www.gnu.org/licenses/gpl-3.0.html"
          target="_blank"
        >
          GNU 通用许可证 v3.0 </a
        >进行分发，获取源码请前往<a
          class="cursor-pointer text-blue-600"
          href="https://cantyonion.site/git/cantyonion/JITARG"
          target="_blank"
          >此处</a
        >。
      </p>
      <br />
      <p>版权所有 &copy; 2025 许方杰</p>
      <p>
        本程序不附带<strong>任何保证</strong>。这是自由软件，您可以在符合特定条件的情况下自由分发。
      </p>
      <br />
      <p>
        This software is distributed under the
        <a
          class="cursor-pointer text-blue-600"
          href="https://www.gnu.org/licenses/gpl-3.0.html"
          target="_blank"
          >GNU General Public License v3.0</a
        >. To obtain the source code, please visit
        <a
          class="cursor-pointer text-blue-600"
          href="https://cantyonion.site/git/cantyonion/JITARG"
          target="_blank"
          >here</a
        >.
      </p>
      <br />
      <p>Copyright &copy; 2025 Jeffery Hsu</p>
      <p>
        This program comes with
        <strong> ABSOLUTELY NO WARRANTY</strong>. This is free software, and you are welcome to
        redistribute it under certain conditions.
      </p>
    </el-dialog>
  </div>
</template>

<style scoped></style>
