Merge pull request #40 from maikusobu/feat/student-department

feat: update feature

src/main.ts

@@ -1,4 +1,4 @@
-import { app, BrowserWindow, ipcMain } from 'electron';
+import { app, BrowserWindow, ipcMain, screen } from 'electron';
 import path from 'path';
 import Store from 'electron-store';
 import { updateElectronApp } from 'update-electron-app';
@@ -22,11 +22,20 @@ ipcMain.on('electron-store-clear', () => {
   store.clear();
 });
 const createWindow = () => {
-  // Create the browser window.
+  const { width, height } = screen.getPrimaryDisplay().workAreaSize;
   const mainWindow = new BrowserWindow({
     webPreferences: {
       preload: path.join(__dirname, 'preload.js'),
     },
+    width,
+    height,
+    minWidth: 800,
+    minHeight: 700,
+    maxWidth: width,
+    maxHeight: height,
+    movable: true,
+    resizable: true,
+    maximizable: true,
     autoHideMenuBar: process.env.NODE_ENV !== 'development',
   });
 

src/renderer/router/index.ts

@@ -8,7 +8,9 @@ import Course from '../views/training-department/course/Course.vue';
 import StudentDepartment from '../views/student-department/StudentDepartment.vue';
 import Student from '../views/student-department/student/Student.vue';
 import Program from '../views/training-department/program/Program.vue';
+import CourseRegistration from '../views/student-department/student/CourseRegistration.vue';
 import resolveDepartmentRoute from '../../utils/resolveDepartmentRoute';
+
 import getSession from '../../utils/getSession';
 
 const routes: Array<RouteRecordRaw> = [
@@ -56,14 +58,17 @@ const routes: Array<RouteRecordRaw> = [
     children: [],
   },
   {
-    //cải thiện load khi cần thiết //
     path: '/student-department', // phòng công tác sinh viên
     component: StudentDepartment,
     children: [
       {
         path: 'student',
         component: Student,
       },
+      {
+        path: 'course-registration',
+        component: CourseRegistration,
+      },
     ],
   },
 ];

src/renderer/views/student-department/StudentDepartment.vue

@@ -4,17 +4,41 @@
       :routes="[
         { name: 'bảng điều khiển', path: '/student-department' },
         { name: 'Sinh viên', path: '/student-department/student' },
+        {
+          name: 'Đăng ký môn học',
+          path: '/student-department/course-registration',
+        },
       ]"
       title="phòng công tác sinh viên"
     />
     <div class="flex flex-col grow">
       <Topbar />
-      <RouterView />
+      <Suspense>
+        <template #default>
+          <RouterView />
+        </template>
+        <template #fallback>
+          <div>Loading...</div>
+        </template>
+      </Suspense>
     </div>
   </div>
 </template>
 
 <script setup>
+import { onMounted, ref } from 'vue';
 import SideBar from '../../components/SideBar.vue';
 import Topbar from '../../components/TopBar.vue';
+import { useStudentStore } from './student/stores/student';
+
+const studentStore = useStudentStore();
+const loading = ref(true);
+
+onMounted(async () => {
+  await studentStore.getMajors();
+  await studentStore.getCourseTypes();
+  await studentStore.getPriorities();
+  await studentStore.getProvince();
+  loading.value = false;
+});
 </script>

src/renderer/views/student-department/student/CourseRegistration.vue

@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import ListMajor from './components/ListMajor.vue';
+import ListOpenCourse from './components/ListOpenCourse.vue';
+import { getTermYear } from '../../../../utils/resolveCurrentTerm';
+
+const currentTerm = getTermYear();
+</script>
+
+<template>
+  <div class="flex flex-col gap-5">
+    <div class="center">
+      <h1>Đăng ký môn học</h1>
+      <div>
+        <p>
+          Học kỳ hiện tại: <span>{{ currentTerm.term }}</span> - Năm học:
+          <span>{{ currentTerm.year }}</span>
+        </p>
+      </div>
+    </div>
+    <div
+      class="border-accent-content/5 border h-[calc(100vh-300px)] w-full flex"
+    >
+      <ListMajor />
+    </div>
+  </div>
+</template>
+
+<style scoped></style>

src/renderer/views/student-department/student/components/CreateModal.vue

@@ -63,6 +63,7 @@
             <option
               v-for="priority in studentStore.priorities"
               :key="priority.id"
+              :disabled="priority.id === 3"
               :value="priority.id"
             >
               {{ priority.name }}

src/renderer/views/student-department/student/components/CreateRegistration.vue

@@ -0,0 +1,48 @@
+<script lang="ts" setup>
+import Table from './Table.vue';
+import Row from './Row.vue';
+</script>
+
+<template>
+  <button
+    class="btn bg-secondary-400 text-base-white hover:bg-secondary-300"
+    onclick="create_modal_opencourse.showModal()"
+  >
+    Đăng ký
+  </button>
+  <dialog id="create_modal_opencourse" class="modal">
+    <div class="modal-box min-w-[900px] w p-15">
+      <form method="dialog">
+        <button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">
+          ✕
+        </button>
+      </form>
+      <form>
+        <table class="table table-pin-rows table-zebra mt-4">
+          <thead>
+            <tr>
+              <th></th>
+              <th class="w-[10%] overflow-hidden">Mã môn</th>
+              <th class="w-[25%] overflow-hidden">Tên môn</th>
+              <th class="w-[15%] overflow-hidden">loại</th>
+              <th class="w-[30%] overflow-hidden">tín chỉ</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td>
+                <input class="checkbox" type="checkbox" />
+              </td>
+              <td class="w-[10%] overflow-hidden">1</td>
+              <td class="w-[25%] overflow-hidden">Khoa hoc</td>
+              <td class="w-[15%] overflow-hidden">Lý thuyết</td>
+              <td class="w-[30%] overflow-hidden">4</td>
+            </tr>
+          </tbody>
+        </table>
+      </form>
+    </div>
+  </dialog>
+</template>
+
+<style scoped></style>

src/renderer/views/student-department/student/components/EditModal.vue

@@ -55,6 +55,10 @@
             <option
               v-for="priority in studentStore.priorities"
               :key="priority.id"
+              :disabled="
+                (priority.id === 3 && !localStudent.district.isMinor) ||
+                (priority.id === 4 && localStudent.district.isMinor)
+              "
               :value="priority.id"
             >
               {{ priority.name }}
@@ -210,6 +214,7 @@ const localStudent = reactive({
   address: '',
   district: {
     provinceId: '',
+    isMinor: false,
   },
 });
 

src/renderer/views/student-department/student/components/ListMajor.vue

@@ -0,0 +1,51 @@
+<script lang="ts" setup>
+import { useStudentStore } from '../stores/student';
+import { onMounted, ref } from 'vue';
+import { useRegistrationStore } from '../stores/registration';
+import Registration from './Registration.vue';
+
+const majorName = ref('');
+const studentStore = useStudentStore();
+const registrationStore = useRegistrationStore();
+const majors = studentStore.majors;
+const setMajor = (major_Name: string) => {
+  majorName.value = major_Name;
+};
+onMounted(async () => {
+  await registrationStore.getCurrentTermYearRegistration();
+  majorName.value = majors[0].name;
+});
+</script>
+
+<template>
+  <div class="p-4 w-[300px] overflow-y-scroll relative pt-0">
+    <h1 class="text-2xl font-bold mb-2 sticky top-0 bg-white px-2">
+      Ngành học
+    </h1>
+    <div class="">
+      <ul class="flex flex-col flex-nowrap">
+        <li
+          v-for="major in majors"
+          :key="major.id"
+          :class="{
+            'bg-blue-400': major.name === majorName,
+            'hover:bg-blue-200': major.name !== majorName,
+          }"
+          class="text-[15px] cursor-pointer py-3 px-2"
+          @click="setMajor(major.name)"
+        >
+          {{ major.name }}
+        </li>
+      </ul>
+    </div>
+  </div>
+  <div class="w-[calc(100%-300px)]">
+    <Registration
+      :id="majors.find((major) => major.name === majorName)?.id"
+      :majorName="majorName"
+      :majors="registrationStore.currentTermYearRegistration?.majors"
+    />
+  </div>
+</template>
+
+<style scoped></style>

src/renderer/views/student-department/student/components/ListOpenCourse.vue

@@ -0,0 +1,28 @@
+<script setup>
+import notFound from '../../../../../assets/images/9169206.jpg';
+</script>
+
+<template>
+  <div class="overflow-x-auto w-full h-[calc(100vh-300px)]">
+    <table class="table table-pin-rows table-zebra">
+      <thead>
+        <tr>
+          <th class="w-[10%] overflow-hidden">Ma môn</th>
+          <th class="w-[25%] overflow-hidden">Tên Môn</th>
+          <th class="w-[15%] overflow-hidden">Loại môn</th>
+          <th class="w-[30%] overflow-hidden">Số tiết</th>
+          <th class="w-[20%] overflow-hidden">Khoa</th>
+        </tr>
+      </thead>
+      <tbody></tbody>
+    </table>
+    <!--    <div-->
+    <!--      v-if="studentStore.students.length === 0"-->
+    <!--      class="w-[32%] mr-auto ml-auto"-->
+    <!--    >-->
+    <!--      <img :src="notFound" alt="notfound" class="object-cover" />-->
+    <!--    </div>-->
+  </div>
+</template>
+
+<style scoped></style>

src/renderer/views/student-department/student/components/Registration.vue

@@ -0,0 +1,45 @@
+<script lang="ts" setup>
+import { useRegistrationStore } from '../stores/registration';
+import ListOpenCourse from './ListOpenCourse.vue';
+import type { MajorWithCourse } from '../stores/registration';
+import CreateRegistration from './CreateRegistration.vue';
+
+const registrationStore = useRegistrationStore();
+defineProps<{
+  id?: string;
+  majorName?: string;
+  majors?: MajorWithCourse[];
+}>();
+</script>
+
+<template>
+  <div
+    v-if="
+      majors && majors.findIndex((major) => major.name === majorName) !== -1
+    "
+  >
+    <div>
+      <div class="flex">
+        <div>
+          <div>Ngành học: {{ majorName }}</div>
+          <h3>Đã đăng ký</h3>
+        </div>
+        <button class="btn btn-error">Xóa</button>
+      </div>
+      <ListOpenCourse
+        :courses="majors.find((major) => major.name === majorName).courses"
+      />
+    </div>
+  </div>
+  <div v-else>
+    <div class="flex justify-around">
+      <div class="">
+        <div>Ngành học: {{ majorName }}</div>
+        <h3>Chưa đăng ký</h3>
+      </div>
+      <CreateRegistration />
+    </div>
+  </div>
+</template>
+
+<style scoped></style>

src/renderer/views/student-department/student/components/Table.vue

@@ -39,9 +39,6 @@ const handleRowClick = (student) => {
   document.getElementById('edit_modal_student').showModal();
 };
 const studentStore = useStudentStore();
-await studentStore.getPriorities();
-await studentStore.getMajors();
-await studentStore.getProvince();
 </script>
 <style scoped>
 table {

src/renderer/views/student-department/student/stores/registration.ts

@@ -0,0 +1,53 @@
+import { defineStore } from 'pinia';
+import { axiosClient } from '../../../../../api/axiosClient';
+import {
+  getTermYear,
+  resolveTerm,
+} from '../../../../../utils/resolveCurrentTerm';
+
+type OpenCourse = {
+  id: number;
+  name: string;
+  numberOfPeriods: number;
+  facultyId: number;
+};
+type CourseType = {
+  id: number;
+  name: string;
+  unitPrice: number;
+};
+export type MajorWithCourse = {
+  name: string;
+  courses: Pick<OpenCourse, 'name' | 'id'>[];
+};
+type CurrentTermYearRegistration = {
+  term: number;
+  year: number;
+  majors: MajorWithCourse[];
+};
+export const useRegistrationStore = defineStore('registration', {
+  state: () => ({
+    currentMajor: '',
+    openCourses: [] as OpenCourse[],
+    courseTypes: [] as CourseType[],
+    currentTermYearRegistration: null as CurrentTermYearRegistration | null,
+  }),
+  actions: {
+    async getOpenCourses() {
+      const response = await axiosClient.get('/open-course');
+      this.openCourses = response.data;
+    },
+    async getCourseTypes() {
+      const response = await axiosClient.get('/course-type');
+      this.courseTypes = response.data;
+    },
+    async getCurrentTermYearRegistration() {
+      const current = getTermYear();
+      const term = resolveTerm(current.term);
+      const response = await axiosClient.get(
+        `/course-registration/current?term=${term}&year=${current.year}`
+      );
+      this.currentTermYearRegistration = response.data;
+    },
+  },
+});

src/renderer/views/student-department/student/stores/student.ts

@@ -7,7 +7,7 @@ type Faculty = {
   id: number;
   name: string;
 };
-type Major = {
+export type Major = {
   id: number;
   name: string;
   facultyId: number;
@@ -48,13 +48,26 @@ enum TypeQuery {
   mssv = 'mssv',
 }
 
+type OpenCourse = {
+  id: number;
+  name: string;
+  numberOfPeriods: number;
+  facultyId: number;
+};
+type courseType = {
+  id: number;
+  name: string;
+  unitPrice: number;
+};
 export const useStudentStore = defineStore('student', {
   state: () => ({
     currentStudent: null as Student | null,
     students: [] as Student[],
     priorities: [] as Priority[],
     provinces: [] as Province[],
     districts: [] as District[],
+    openCourses: [] as OpenCourse[],
+    courseTypes: [] as courseType[],
     majors: [] as Major[],
     page: 1,
     errorMessages: {} as Record<string, any>,
@@ -224,7 +237,19 @@ export const useStudentStore = defineStore('student', {
         toast('Xóa sinh viên thất bại', 'error');
       }
     },
-
+    async getOpenCourses() {
+      const response = await axiosClient.get('/open-course', {
+        id: 'list-open-course',
+      });
+      this.openCourses = response.data;
+    },
+    async getCourseTypes() {
+      const response = await axiosClient.get('/course-type', {
+        id: 'list-course-type',
+      });
+      this.courseTypes = response.data;
+    },
+    async updateStudentCourses(studentId: number, courseIds: number[]) {},
     selectTypeQuery(value: TypeQuery) {
       this.search.typeQuery = value;
     },

src/utils/resolveCurrentTerm.ts

@@ -0,0 +1,26 @@
+export function getTermYear() {
+  const currentDate = new Date();
+  const month = currentDate.getMonth() + 1;
+  const year = currentDate.getFullYear();
+  let term;
+
+  if (month >= 1 && month <= 4) {
+    term = 'kì 1';
+  } else if (month >= 5 && month <= 8) {
+    term = 'kì 2';
+  } else {
+    term = 'hè';
+  }
+
+  return { term: term, year: year };
+}
+
+export function resolveTerm(term: string) {
+  if (term === 'kì 1') {
+    return 'first';
+  } else if (term === 'kì 2') {
+    return 'second';
+  } else {
+    return 'third';
+  }
+}