Merge pull request #12 from gdsc-ncku/yeeway

fix: Refactor router to dynamic router

src/data/featuredArticles.json

@@ -3,120 +3,154 @@
     "id": "selfLearnin_1",
     "title": "真假新聞分不清？不私藏網路新聞指南！",
     "category": "自學力",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "林盈辰",
+    "uploadDate": "2023-12-28",
+    "content": "",
+    "imageURL": ["../assets/Forum_page/FeaturedArticles/selfLearnin_1/1.webp", "../assets/Forum_page/FeaturedArticles/selfLearnin_1/2.webp", "../assets/Forum_page/FeaturedArticles/selfLearnin_1/3.webp", "../assets/Forum_page/FeaturedArticles/selfLearnin_1/4.webp", "../assets/Forum_page/FeaturedArticles/selfLearnin_1/5.webp", "../assets/Forum_page/FeaturedArticles/selfLearnin_1/6.webp"]
   },
   {
     "id": "selfLearning_2",
     "title": "在路上學習：通勤時Podcast推薦！",
     "category": "自學力",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "selfLearning_3",
     "title": "知識輕鬆GET！值得訂閱的YouTube頻道",
     "category": "自學力",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "education_1",
     "title": "你不知道的學習歷程，原來還能這樣寫！",
     "category": "衝升學",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "education_2",
     "title": "繁殺不死我的，必使我成長，究竟在繁什麼？",
     "category": "衝升學",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "education_3",
     "title": "如果沒有東西可以參考，還可以這些網站",
     "category": "衝升學",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "education_4",
     "title": "我們所不知道的升學",
     "category": "衝升學",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "education_5",
     "title": "失敗了不要氣餒，還可以為自己創造一條路",
     "category": "衝升學",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "skill_1",
     "title": "商管學院才用得到分析工具？用SWOT分析來了解自己！",
     "category": "技能點",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "skill_2",
     "title": "簡報軟體該怎麼選？一起成為簡報master!",
     "category": "技能點",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "skill_3",
     "title": "成為工程師的第一步－認識程式語言",
     "category": "技能點",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "skill_4",
     "title": "Notion紅什麼？用Notion打造效率人生！",
     "category": "技能點",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "life_2",
     "title": "華語音樂",
     "category": "懂生活",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "life_3",
     "title": "電視電影",
     "category": "懂生活",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "exam_1",
     "title": "運氣快快來-找到適合自己的讀書方式",
     "category": "拼考試",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "exam_2",
     "title": "考運爆棚-天公伯保佑我！",
     "category": "拼考試",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   },
   {
     "id": "exam_3",
     "title": "能力開光加持-證照一把抓",
     "category": "拼考試",
-    "author": "王小明",
-    "content": "巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉巴拉"
+    "author": "",
+    "uploadDate": "",
+    "content": "",
+    "imageURL": []
   }
 ]
 

src/dist/router.dev.js

@@ -13,10 +13,6 @@ var _About = _interopRequireDefault(require("./views/About.vue"));
 
 var _Info = _interopRequireDefault(require("./views/Info.vue"));
 
-var _Souvenir = _interopRequireDefault(require("./views/Souvenir.vue"));
-
-var _Partners = _interopRequireDefault(require("./views/Partners.vue"));
-
 var _Activities = _interopRequireDefault(require("./views/activities/Activities.vue"));
 
 var _MainStage = _interopRequireDefault(require("./views/activities/MainStage.vue"));
@@ -47,6 +43,10 @@ var _featuredArticles = _interopRequireDefault(require("./data/featuredArticles.
 
 var _letterToHighSchoolStudents = _interopRequireDefault(require("./data/letterToHighSchoolStudents.json"));
 
+var _Souvenir = _interopRequireDefault(require("./views/Souvenir.vue"));
+
+var _Partners = _interopRequireDefault(require("./views/Partners.vue"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var routes = [{
@@ -113,14 +113,26 @@ var routes = [{
   path: '/forum/departmentHandbook',
   name: '科系手冊',
   component: _DepartmentHandbook["default"]
+}, {
+  path: '/forum/departmentHandbook/:department',
+  name: '科系手冊-科系',
+  component: _DepartmentHandbook["default"]
 }, {
   path: '/forum/featuredArticles',
   name: '專欄文章',
   component: _FeaturedArticles["default"]
+}, {
+  path: '/forum/featuredArticles/:article',
+  name: '專欄文章-貼文',
+  component: _FeaturedArticles["default"]
 }, {
   path: '/forum/letterToHighSchoolStudents',
   name: '給高中生的一封信',
   component: _LetterToHighSchoolStudents["default"]
+}, {
+  path: '/forum/letterToHighSchoolStudents/:letter',
+  name: '給高中生的一封信-貼文',
+  component: _LetterToHighSchoolStudents["default"]
 }, {
   path: '/partners',
   name: '合作夥伴',
@@ -129,36 +141,7 @@ var routes = [{
   path: '/souvenir',
   name: '紀念品小舖',
   component: _Souvenir["default"]
-}]; // add routes for each department under "departmentHandbook" page
-
-_departmentHandbook["default"].map(function (college) {
-  college.departments.map(function (department) {
-    routes.push({
-      path: '/forum/departmentHandBook/' + department.id,
-      name: department.name,
-      component: _DepartmentHandbook["default"]
-    });
-  });
-}); // add routes for each article under "featuredArticles" page
-
-
-_featuredArticles["default"].map(function (article) {
-  routes.push({
-    path: '/forum/featuredArticles/' + article.id,
-    name: article.title,
-    component: _FeaturedArticles["default"]
-  });
-}); // add routes for each letter under "letterToHighSchoolStudents" page
-
-
-_letterToHighSchoolStudents["default"].map(function (letter) {
-  routes.push({
-    path: '/forum/letterToHighSchoolStudents/' + letter.id,
-    name: letter.title,
-    component: _LetterToHighSchoolStudents["default"]
-  });
-});
-
+}];
 var router = (0, _vueRouter.createRouter)({
   history: (0, _vueRouter.createWebHistory)('/BikeFestival17th-Frontend/'),
   routes: routes

src/router.js

@@ -2,9 +2,6 @@ import { createRouter, createWebHistory } from 'vue-router'
 import Home from './views/Home.vue';
 import About from './views/About.vue';
 import Info from './views/Info.vue';
-import Souvenir from './views/Souvenir.vue';
-import Partners from './views/Partners.vue';
-
 import Activities from './views/activities/Activities.vue';
 import MainStage from './views/activities/MainStage.vue';
 import DepartmentExpo from './views/activities/DepartmentExpo.vue';
@@ -13,14 +10,15 @@ import UniversityBlueprint from './views/activities/UniversityBlueprint.vue';
 import LifeCrossroads from './views/activities/LifeCrossroads.vue';
 import ImmersiveExperience from './views/activities/ImmersiveExperience.vue';
 import UnworriedTeaHouse from './views/activities/UnworriedTeaHouse.vue';
-
 import Forum from './views/forum/Forum.vue';
 import DepartmentHandbook from './views/forum/DepartmentHandbook.vue';
 import FeaturedArticles from './views/forum/FeaturedArticles.vue';
 import LetterToHighSchoolStudents from './views/forum/LetterToHighSchoolStudents.vue';
 import departmentHandbookData from "./data/departmentHandbook.json";
 import featuredArticlesData from "./data/featuredArticles.json";
 import letterToHighSchoolStudentsData from "./data/letterToHighSchoolStudents.json";
+import Souvenir from './views/Souvenir.vue';
+import Partners from './views/Partners.vue';
 
 const routes = [
   { path: '/', name: '首頁', component: Home },
@@ -39,41 +37,15 @@ const routes = [
   { path: '/activities/unworriedTeaHouse', name: '解憂茶軒', component: UnworriedTeaHouse },
   { path: '/forum', name: '知識論壇', component: Forum },
   { path: '/forum/departmentHandbook', name: '科系手冊', component: DepartmentHandbook },
+  { path: '/forum/departmentHandbook/:department', name: '科系手冊-科系', component: DepartmentHandbook },
   { path: '/forum/featuredArticles', name: '專欄文章', component: FeaturedArticles },
+  { path: '/forum/featuredArticles/:article', name: '專欄文章-貼文', component: FeaturedArticles },
   { path: '/forum/letterToHighSchoolStudents', name: '給高中生的一封信', component: LetterToHighSchoolStudents },
+  { path: '/forum/letterToHighSchoolStudents/:letter', name: '給高中生的一封信-貼文', component: LetterToHighSchoolStudents },
   { path: '/partners', name: '合作夥伴', component: Partners },
   { path: '/souvenir', name: '紀念品小舖', component: Souvenir },
 ];
 
-// add routes for each department under "departmentHandbook" page
-departmentHandbookData.map((college) => {
-  college.departments.map((department) => {
-    routes.push({
-      path: '/forum/departmentHandBook/' + department.id,
-      name: department.name,
-      component: DepartmentHandbook
-    });
-  });
-});
-
-// add routes for each article under "featuredArticles" page
-featuredArticlesData.map((article) => {
-  routes.push({
-    path: '/forum/featuredArticles/' + article.id,
-    name: article.title,
-    component: FeaturedArticles
-  });
-});
-
-// add routes for each letter under "letterToHighSchoolStudents" page
-letterToHighSchoolStudentsData.map((letter) => {
-  routes.push({
-    path: '/forum/letterToHighSchoolStudents/' + letter.id,
-    name: letter.title,
-    component: LetterToHighSchoolStudents
-  });
-});
-
 const router = createRouter({
   history: createWebHistory('/BikeFestival17th-Frontend/'),
   routes,

src/style.css

@@ -7,7 +7,7 @@
         font-family: "Noto Sans TC", sans-serif;
     }
     body {
-        background-image: url(/public/bg_noise_texture.svg);
+        background-image: url(/bg_noise_texture.svg);
         background-color: #FFF8F2;
     }
 }

vite.config.js

@@ -1,8 +1,14 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import path from 'path';
 
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [vue()],
   base: process.env.NODE_ENV === 'production' ? '/BikeFestival17th-Frontend/' : '/',
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, 'src'),
+    },
+  },
 })