Styling: Format and styles (#32)

* added @types/node for resolving @ symbols in import

* added @ resolving in vite config

* general formating

* default order by = general

* removed markdown-it

* adapting numerals and removing markdown-it

* fix sorting in get lecturers

* changed filter icon in search bar

package.json

@@ -27,6 +27,7 @@
     "@mdi/font": "^7.4.47",
     "@profcomff/api-uilib": "^2024.10.22",
     "@types/eslint__js": "^8.42.3",
+    "@types/node": "^22.9.0",
     "@typescript-eslint/eslint-plugin": "^8.13.0",
     "@typescript-eslint/parser": "^8.13.0",
     "@vitejs/plugin-vue": "^4.6.2",
@@ -36,7 +37,6 @@
     "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-vue": "^9.30.0",
     "globals": "^15.12.0",
-    "markdown-it": "^14.1.0",
     "openapi-typescript": "^7.4.2",
     "postcss-html": "^1.7.0",
     "postcss-preset-env": "^9.6.0",

src/App.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import { useProfileStore } from './store';
+import { useProfileStore } from '@/store';
 import { onMounted } from 'vue';
 import { setupAuth } from '@profcomff/api-uilib';
-import ToastList from './components/ToastList.vue';
+import ToastList from '@/components/ToastList.vue';
 
 const profileStore = useProfileStore();
 

src/components/AdminReviewCard.vue

@@ -31,9 +31,9 @@
 </template>
 
 <script setup lang="ts">
-import apiClient from "../api";
-import { ToastType } from "../models";
-import { useToastStore } from "../store/toastStore";
+import apiClient from "@/api";
+import { ToastType } from "@/models";
+import { useToastStore } from "@/store/toastStore";
 
 defineProps({
   comment: { type: Object, required: true },

src/components/TheLecturerSearchCard.vue

@@ -28,10 +28,10 @@
             size="small"
           ></v-chip>
         </v-chip-group>
-        <div>отзывы: {{ lecturer.comments?.length ?? "нет" }}</div>
+        <div>отзывы: {{ lecturer.comments?.length ?? "—" }}</div>
         <div>
           оценка: {{ lecturer.mark_general > 0 ? "+" : ""
-          }}{{ lecturer.mark_general?.toFixed(2) ?? "нет" }}
+          }}{{ lecturer.mark_general?.toFixed(2) ?? "—" }}
         </div>
       </div>
     </template>
@@ -52,7 +52,7 @@
 </template>
 
 <script setup lang="ts">
-import { router } from "../router";
+import { router } from "@/router";
 import { useDisplay } from "vuetify";
 
 const { mobile } = useDisplay();

src/components/TheReviewCard.vue

@@ -64,9 +64,9 @@
 </template>
 
 <script setup lang="ts">
-import apiClient from "../api";
+import apiClient from "@/api";
 import { ref } from "vue";
-import { useProfileStore } from "../store";
+import { useProfileStore } from "@/store";
 
 const profileStore = useProfileStore();
 const isUserAdmin = ref(false);

src/components/TheSearchBar.vue

@@ -20,7 +20,7 @@
         <template #activator="{ props }">
           <v-btn
             v-bind="props"
-            :icon="'mdi-table-of-contents'"
+            :icon="'mdi-filter-variant'"
             color="grey"
             variant="flat"
             focused
@@ -41,7 +41,7 @@
               v-model="order"
               class="text-body-1"
               label="Сортировка"
-              :items="['', 'по общей оценке']"
+              :items="orderTypes"
               density="compact"
               @click.stop
             />
@@ -62,14 +62,21 @@
 </template>
 
 <script setup lang="ts">
-import { SUBJECTS } from "../constants";
+import { SUBJECTS } from "@/constants";
 defineProps({
   isAdmin: { type: Boolean, required: true },
 });
 
 const searchQuery = defineModel("searchQuery", { type: String });
 const subject = defineModel("subject", { type: String });
 const order = defineModel("order", { type: String });
+const orderTypes = [
+  "по общей оценке",
+  "по доброте",
+  "по халявности",
+  "по понятности",
+  "по фамилии",
+];
 
 const emits = defineEmits({
   "find-lecturer": () => {

src/components/ToastList.vue

@@ -1,10 +1,3 @@
-<script setup lang="ts">
-import { useToastStore } from "../store/toastStore";
-import ToastView from "./ToastView.vue";
-
-const toastStore = useToastStore();
-</script>
-
 <template>
   <div class="toast-list">
     <ToastView
@@ -16,6 +9,13 @@ const toastStore = useToastStore();
   </div>
 </template>
 
+<script setup lang="ts">
+import { useToastStore } from "@/store/toastStore";
+import ToastView from "./ToastView.vue";
+
+const toastStore = useToastStore();
+</script>
+
 <style scoped>
 .toast-list {
   position: fixed;