1 rok temu · af59179c66
--- a/index.html
+++ b/index.html
@@ -11,7 +11,7 @@
 
				   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
			
 
				   <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500&display=swap" rel="stylesheet">
			
 
				   
			
 
				-  <title>國立臺灣工藝研究發展中心</title>
			
 
				+  <title>臺灣工藝學校全球學習共享平台</title>
			
 
				 </head>
			
 
				 
			
 
				 <body>
			
--- a/public/index.html
+++ b/public/index.html
@@ -11,7 +11,7 @@
 
				   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
			
 
				   <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100;300;400;500&display=swap" rel="stylesheet">
			
 
				   
			
 
				-  <title>國立臺灣工藝研究發展中心</title>
			
 
				+  <title>臺灣工藝學校全球學習共享平台</title>
			
 
				   <script type="module" crossorigin src="/assets/index.js"></script>
			
 
				   <link rel="stylesheet" href="/assets/index.css">
			
 
				 </head>
			
--- a/src/assets/css/style.css
+++ b/src/assets/css/style.css
@@ -425,9 +425,6 @@ input:focus-visible {
 
				   flex-direction: column;
			
 
				   padding: 0.625em;
			
 
				 }
			
 
				-.main-card .card-info span {
			
 
				-  height: 3.75em;
			
 
				-}
			
 
				 .main-card .card-info span p {
			
 
				   line-height: 1.25em;
			
 
				 }
			
@@ -483,11 +480,63 @@ input:focus-visible {
 
				   z-index: 1000;
			
 
				 }
			
 
				 
			
 
				+.notes-block {
			
 
				+  padding: 30px;
			
 
				+  font-size: 1.15em;
			
 
				+  color: #9b9b9b;
			
 
				+  background-color: #f9f9f9;
			
 
				+  border-radius: 5px;
			
 
				+}
			
 
				+.notes-block p,
			
 
				+.notes-block li {
			
 
				+  letter-spacing: 0.05em;
			
 
				+}
			
 
				+.notes-block li {
			
 
				+  margin-bottom: 10px;
			
 
				+  line-height: 1.8em;
			
 
				+}
			
 
				+.notes-block li:last-child {
			
 
				+  margin-bottom: 0;
			
 
				+}
			
 
				+
			
 
				+.section-list li {
			
 
				+  background: #eee;
			
 
				+  padding: 15px 20px;
			
 
				+  border-radius: 5px;
			
 
				+  margin-bottom: 15px;
			
 
				+}
			
 
				+
			
 
				+.category-list {
			
 
				+  display: grid;
			
 
				+  grid-template-columns: repeat(auto-fit, minmax(9.0625em, max-content));
			
 
				+  justify-content: center;
			
 
				+  padding: initial;
			
 
				+}
			
 
				+.category-list li {
			
 
				+  list-style-type: none;
			
 
				+}
			
 
				+.category-list li a {
			
 
				+  display: block;
			
 
				+  padding: 0.5em 1.25em;
			
 
				+  margin-bottom: 1.25em;
			
 
				+  border: 0.0625em solid #b8b8b8;
			
 
				+  border-radius: 0.3125em;
			
 
				+  letter-spacing: 0.0625em;
			
 
				+  line-height: 1.375em;
			
 
				+  text-align: center;
			
 
				+  transition: all 0.3s;
			
 
				+}
			
 
				+.category-list li a:hover {
			
 
				+  background-color: #f3f3f3;
			
 
				+}
			
 
				+
			
 
				 .tag-btn .item {
			
 
				   display: flex;
			
 
				   align-items: center;
			
 
				   justify-content: center;
			
 
				   width: 100%;
			
 
				+  height: 100%;
			
 
				+  padding: 0 20px;
			
 
				   color: var(--purple);
			
 
				   border: 0.0625em solid var(--purple);
			
 
				   border-radius: 0.625em;
			
@@ -716,6 +765,74 @@ input:focus-visible {
 
				   letter-spacing: 0.0625em;
			
 
				 }
			
 
				 
			
 
				+.article {
			
 
				+  margin: auto;
			
 
				+  padding: 5em 3.125em;
			
 
				+  display: flex;
			
 
				+  justify-content: center;
			
 
				+  border: 0.0625em solid #d4d6d8;
			
 
				+  border-radius: 3.125em;
			
 
				+}
			
 
				+@media (max-width: 600px) {
			
 
				+  .article {
			
 
				+    padding: 3.125em 0;
			
 
				+    border: none;
			
 
				+  }
			
 
				+}
			
 
				+.article h2 {
			
 
				+  font-size: 1.75em;
			
 
				+  line-height: 1.75em;
			
 
				+  font-weight: 500;
			
 
				+  letter-spacing: 0.125em;
			
 
				+}
			
 
				+.article table {
			
 
				+  text-align: start;
			
 
				+}
			
 
				+.article table td {
			
 
				+  padding: 0 25px;
			
 
				+  vertical-align: top;
			
 
				+}
			
 
				+.article table img {
			
 
				+  width: 100%;
			
 
				+  -o-object-fit: contain;
			
 
				+     object-fit: contain;
			
 
				+}
			
 
				+.article section {
			
 
				+  height: 100%;
			
 
				+  padding: 1.875em;
			
 
				+}
			
 
				+.article section p {
			
 
				+  font-size: 1.125em;
			
 
				+  font-weight: 400;
			
 
				+  line-height: 2em;
			
 
				+  letter-spacing: 0.0625em;
			
 
				+  white-space: pre-line;
			
 
				+}
			
 
				+.article .cover-img {
			
 
				+  width: 100%;
			
 
				+  max-height: 31.25em;
			
 
				+}
			
 
				+@media (max-width: 600px) {
			
 
				+  .article .cover-img {
			
 
				+    height: auto;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.back-link {
			
 
				+  display: block;
			
 
				+  text-align: center;
			
 
				+  transition: all 0.3s;
			
 
				+  letter-spacing: 0.0625em;
			
 
				+}
			
 
				+.back-link:hover {
			
 
				+  opacity: 0.8;
			
 
				+}
			
 
				+
			
 
				+.btn-block {
			
 
				+  display: flex;
			
 
				+  justify-content: end;
			
 
				+}
			
 
				+
			
 
				 .user-courses .v-table {
			
 
				   padding: 1.25em;
			
 
				 }
			
@@ -723,6 +840,11 @@ input:focus-visible {
 
				   padding: 10px;
			
 
				   background-color: var(--blue);
			
 
				 }
			
 
				+@media (max-width: 600px) {
			
 
				+  .user-courses .tab-btn {
			
 
				+    padding: 20px;
			
 
				+  }
			
 
				+}
			
 
				 .user-courses .tab-btn button {
			
 
				   margin: 0 10px;
			
 
				   color: #fff;
			
@@ -740,9 +862,6 @@ input:focus-visible {
 
				 .user-courses .search-item img {
			
 
				   width: 1.5625em;
			
 
				 }
			
 
				-.user-courses .main-table {
			
 
				-  margin-top: -35px;
			
 
				-}
			
 
				 .user-courses .table-title {
			
 
				   background-color: var(--blue);
			
 
				 }
			
--- a/src/assets/css/style.css.map
+++ b/src/assets/css/style.css.map
--- a/src/assets/css/style.scss
+++ b/src/assets/css/style.scss
@@ -441,7 +441,7 @@ input:focus-visible {
 
				     }
			
 
				 
			
 
				     span {
			
 
				-      height: 3.75em;
			
 
				+      // height: 3.75em;
			
 
				 
			
 
				       p {
			
 
				         line-height: 1.25em;
			
@@ -516,6 +516,64 @@ input:focus-visible {
 
				   z-index: 1000;
			
 
				 }
			
 
				 
			
 
				+.notes-block {
			
 
				+  padding: 30px;
			
 
				+  font-size: 1.15em;
			
 
				+  color: #9b9b9b;
			
 
				+  background-color: #f9f9f9;
			
 
				+  border-radius: 5px;
			
 
				+
			
 
				+  p,
			
 
				+  li {
			
 
				+    letter-spacing: 0.05em;
			
 
				+  }
			
 
				+
			
 
				+  li {
			
 
				+    margin-bottom: 10px;
			
 
				+    line-height: 1.8em;
			
 
				+
			
 
				+    &:last-child {
			
 
				+      margin-bottom: 0;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.section-list {
			
 
				+  li {
			
 
				+    background: #eee;
			
 
				+    padding: 15px 20px;
			
 
				+    border-radius: 5px;
			
 
				+    margin-bottom: 15px;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.category-list {
			
 
				+  display: grid;
			
 
				+  grid-template-columns: repeat(auto-fit, minmax(9.0625em, max-content));
			
 
				+  justify-content: center;
			
 
				+  padding: initial;
			
 
				+
			
 
				+  li {
			
 
				+    list-style-type: none;
			
 
				+
			
 
				+    a {
			
 
				+      display: block;
			
 
				+      padding: 0.5em 1.25em;
			
 
				+      margin-bottom: 1.25em;
			
 
				+      border: 0.0625em solid #b8b8b8;
			
 
				+      border-radius: 0.3125em;
			
 
				+      letter-spacing: 0.0625em;
			
 
				+      line-height: 1.375em;
			
 
				+      text-align: center;
			
 
				+      transition: all 0.3s;
			
 
				+
			
 
				+      &:hover {
			
 
				+        background-color: #f3f3f3;
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				 .tag-btn {
			
 
				   // @media (max-width: 960px) {
			
 
				   //   margin: auto !important;
			
@@ -528,6 +586,8 @@ input:focus-visible {
 
				     align-items: center;
			
 
				     justify-content: center;
			
 
				     width: 100%;
			
 
				+    height: 100%;
			
 
				+    padding: 0 20px;
			
 
				     // display: block;
			
 
				     color: var(--purple);
			
 
				     border: 0.0625em solid var(--purple);
			
@@ -786,6 +846,83 @@ input:focus-visible {
 
				   }
			
 
				 }
			
 
				 
			
 
				+.article {
			
 
				+  margin: auto;
			
 
				+  padding: 5em 3.125em;
			
 
				+  display: flex;
			
 
				+  justify-content: center;
			
 
				+  border: 0.0625em solid #d4d6d8;
			
 
				+  border-radius: 3.125em;
			
 
				+
			
 
				+  // @media (max-width: 960px) {
			
 
				+  //   width: 80%;
			
 
				+  // }
			
 
				+
			
 
				+  @media (max-width: 600px) {
			
 
				+    padding: 3.125em 0;
			
 
				+    border: none;
			
 
				+  }
			
 
				+
			
 
				+  h2 {
			
 
				+    font-size: 1.75em;
			
 
				+    line-height: 1.75em;
			
 
				+    font-weight: 500;
			
 
				+    letter-spacing: 0.125em;
			
 
				+  }
			
 
				+
			
 
				+  table {
			
 
				+    text-align: start;
			
 
				+
			
 
				+    td {
			
 
				+      padding: 0 25px;
			
 
				+      vertical-align: top;
			
 
				+    }
			
 
				+
			
 
				+    img {
			
 
				+      width: 100%;
			
 
				+      object-fit: contain;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  section {
			
 
				+    height: 100%;
			
 
				+    padding: 1.875em;
			
 
				+
			
 
				+    p {
			
 
				+      font-size: 1.125em;
			
 
				+      font-weight: 400;
			
 
				+      line-height: 2em;
			
 
				+      letter-spacing: 0.0625em;
			
 
				+      white-space: pre-line;
			
 
				+    }
			
 
				+  }
			
 
				+
			
 
				+  .cover-img {
			
 
				+    width: 100%;
			
 
				+    max-height: 31.25em;
			
 
				+
			
 
				+    @media (max-width: 600px) {
			
 
				+      height: auto;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.back-link {
			
 
				+  display: block;
			
 
				+  text-align: center;
			
 
				+  transition: all 0.3s;
			
 
				+  letter-spacing: 0.0625em;
			
 
				+
			
 
				+  &:hover {
			
 
				+    opacity: 0.8;
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.btn-block {
			
 
				+  display: flex;
			
 
				+  justify-content: end;
			
 
				+}
			
 
				+
			
 
				 .user-courses {
			
 
				   // p,
			
 
				   // a {
			
@@ -800,6 +937,10 @@ input:focus-visible {
 
				     padding: 10px;
			
 
				     background-color: var(--blue);
			
 
				 
			
 
				+    @media (max-width: 600px) {
			
 
				+      padding: 20px;
			
 
				+    }
			
 
				+
			
 
				     button {
			
 
				       margin: 0 10px;
			
 
				       color: #fff;
			
@@ -822,9 +963,9 @@ input:focus-visible {
 
				     }
			
 
				   }
			
 
				 
			
 
				-  .main-table {
			
 
				-    margin-top: -35px;
			
 
				-  }
			
 
				+  // .main-table {
			
 
				+  //   margin-top: -35px;
			
 
				+  // }
			
 
				 
			
 
				   .table-title {
			
 
				     background-color: var(--blue);
			
--- a/src/assets/img/craftplus-logo.png
+++ b/src/assets/img/craftplus-logo.png
--- a/src/assets/img/project/ProjectImage1.jpg
+++ b/src/assets/img/project/ProjectImage1.jpg
--- a/src/assets/img/project/ProjectImage10.jpg
+++ b/src/assets/img/project/ProjectImage10.jpg
--- a/src/assets/img/project/ProjectImage2.jpg
+++ b/src/assets/img/project/ProjectImage2.jpg
--- a/src/assets/img/project/ProjectImage3.jpg
+++ b/src/assets/img/project/ProjectImage3.jpg
--- a/src/assets/img/project/ProjectImage4.jpg
+++ b/src/assets/img/project/ProjectImage4.jpg
--- a/src/assets/img/project/ProjectImage5.jpg
+++ b/src/assets/img/project/ProjectImage5.jpg
--- a/src/assets/img/project/ProjectImage6.jpg
+++ b/src/assets/img/project/ProjectImage6.jpg
--- a/src/assets/img/project/ProjectImage7.jpg
+++ b/src/assets/img/project/ProjectImage7.jpg
--- a/src/assets/img/project/ProjectImage8.jpg
+++ b/src/assets/img/project/ProjectImage8.jpg
--- a/src/assets/img/project/ProjectImage9.jpg
+++ b/src/assets/img/project/ProjectImage9.jpg
--- a/src/assets/img/text_1.jpg
+++ b/src/assets/img/text_1.jpg
--- a/src/assets/img/text_2.jpg
+++ b/src/assets/img/text_2.jpg
--- a/src/assets/img/text_3.jpg
+++ b/src/assets/img/text_3.jpg
--- a/src/components/CourseCard.vue
+++ b/src/components/CourseCard.vue
@@ -127,16 +127,13 @@ function isClassFavorite(classId) {
 
				         </div>
			
 
				       </a>
			
 
				 
			
 
				-<div class="d-flex justify-end mt-3">
			
 
				-  <small class="text-gray">編號：{{data.encode}}</small>
			
 
				-</div>
			
 
				-
			
 
				+      <div class="d-flex justify-end mt-3">
			
 
				+        <small class="text-gray">編號：{{ data.encode }}</small>
			
 
				+      </div>
			
 
				       <!-- </router-link> -->
			
 
				+      
			
 
				       <ul v-if="data.org !== 'Udemy'">
			
 
				         <li class="d-flex align-center mb-5">
			
 
				-          <!-- <p class="text-gray pt-3">
			
 
				-            {{ data.introduction }}
			
 
				-          </p> -->
			
 
				           <div class="description">
			
 
				             <p
			
 
				               class="text-gray pt-3"
			
@@ -144,12 +141,6 @@ function isClassFavorite(classId) {
 
				             ></p>
			
 
				           </div>
			
 
				         </li>
			
 
				-        <!-- <li class="d-flex align-center mt-auto">
			
 
				-          <v-icon color="primary" icon="mdi-map-marker" class="me-1"></v-icon>
			
 
				-          <p class="mb-0 pe-3">
			
 
				-            {{ data.location_name }}
			
 
				-          </p>
			
 
				-        </li> -->
			
 
				         <li class="d-flex align-center justify-space-between">
			
 
				           <div class="d-flex align-center">
			
 
				             <v-icon
			
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -277,6 +277,9 @@ function handleLogout() {
 
				             <li>
			
 
				               <router-link :to="'/user/passport'">學習護照</router-link>
			
 
				             </li>
			
 
				+            <li>
			
 
				+              <router-link :to="'/user/courses'">我的開課</router-link>
			
 
				+            </li>
			
 
				             <li>
			
 
				               <router-link :to="'/user/favorite-class'">我的收藏</router-link>
			
 
				             </li>
			
@@ -390,7 +393,7 @@ function handleLogout() {
 
				 
			
 
				     @media (max-width: 1280px) {
			
 
				       position: absolute;
			
 
				-      top: 5.0625em;
			
 
				+      top: 5.3em;
			
 
				       left: 0;
			
 
				       right: 0;
			
 
				       z-index: 100;
			
--- a/src/stores/store.js
+++ b/src/stores/store.js
@@ -94,10 +94,11 @@ export const useMainStore = defineStore('mainStore', {
 
				     },
			
 
				     // DatePicker
			
 
				     datePickerFormat(date) {
			
 
				+      console.log('date', date);
			
 
				       const day = date.getDate();
			
 
				       const month = date.getMonth() + 1;
			
 
				       const year = date.getFullYear();
			
 
				-
			
 
				+      console.log(' `${year}-${month}-${day}`', `${year}-${month}-${day}`);
			
 
				       return `${year}-${month}-${day}`;
			
 
				     },
			
 
				     // 處理時間格式(日期+時間)
			
@@ -117,6 +118,13 @@ export const useMainStore = defineStore('mainStore', {
 
				 
			
 
				       return `${year}-${month}-${day}T${hours}:${minutes}:${seconds}.000Z`;
			
 
				     },
			
 
				+    // 將 UTC 時間轉換為台灣時間
			
 
				+    convertUTCtoTaiwanTime(utcTimeString) {
			
 
				+      const utcTime = new Date(utcTimeString);
			
 
				+      const localTime = new Date(utcTime.getTime() + utcTime.getTimezoneOffset() * 60 * 1000);
			
 
				+      console.log('轉台灣時間', localTime);
			
 
				+      return localTime;
			
 
				+    },
			
 
				     getPDF(name) {
			
 
				       return `https://ntcri.org/pdf/${name}.pdf`;
			
 
				     },
			
--- a/src/utils/useReadList.js
+++ b/src/utils/useReadList.js
@@ -48,7 +48,7 @@ const readList = [
 
				     img: store.getImageUrl("crafts/知識文章-27.png"),
			
 
				     fileName: "Local_Fishery_Waste",
			
 
				     content:
			
 
				-      "由國立臺灣工藝研究發展中心主辦、物嶼哲概念有限公司執行以及荷蘭 Material Experience Lab 合作之「國際材質試驗研究室交流合作計畫－「拾鱗計畫 Project FS」，目的在轉化臺南在地漁業的第一批廢棄物－「魚鱗」，尋找更多的創作應用機會點，使得魚鱗能夠透過材質試驗、工藝創作應用，以不同的視野進入文化層面，開啟新的生命循環。臺南可說是全臺公認的美食及文化之都，其小吃的豐富性及多樣化使各地饕客趨之若鶩，而其中「虱目魚」相關的品項，不論是魚皮、魚肚、魚肉等…，更深受大家的喜愛，在美食文化之中具有舉足輕重的地位，臺南也是虱目魚最重要的養殖區域，其在地性及與當地文化的聯結非常密切...",
			
 
				+      "由臺灣工藝學校全球學習共享平台主辦、物嶼哲概念有限公司執行以及荷蘭 Material Experience Lab 合作之「國際材質試驗研究室交流合作計畫－「拾鱗計畫 Project FS」，目的在轉化臺南在地漁業的第一批廢棄物－「魚鱗」，尋找更多的創作應用機會點，使得魚鱗能夠透過材質試驗、工藝創作應用，以不同的視野進入文化層面，開啟新的生命循環。臺南可說是全臺公認的美食及文化之都，其小吃的豐富性及多樣化使各地饕客趨之若鶩，而其中「虱目魚」相關的品項，不論是魚皮、魚肚、魚肉等…，更深受大家的喜愛，在美食文化之中具有舉足輕重的地位，臺南也是虱目魚最重要的養殖區域，其在地性及與當地文化的聯結非常密切...",
			
 
				   },
			
 
				   {
			
 
				     title: "新絲維",
			
--- a/src/views/ArticleDetail.vue
+++ b/src/views/ArticleDetail.vue
@@ -13,20 +13,15 @@ const store = useMainStore();
 
				 // 網址參數
			
 
				 const articleId = route.params.id;
			
 
				 // const articleCategory = route.params.category;
			
 
				-// console.log("articleCategory", articleCategory);
			
 
				-
			
 
				-// if (articleCategory === "book") {
			
 
				-//   getArticle();
			
 
				-// } else if (articleCategory === "article") {
			
 
				-//   getArticle();
			
 
				-// }
			
 
				-
			
 
				-// let filePath = ref("");
			
 
				 
			
 
				 let file = reactive({
			
 
				   list: [],
			
 
				 });
			
 
				 
			
 
				+let tags = reactive({
			
 
				+  data: {},
			
 
				+});
			
 
				+
			
 
				 let list = reactive({
			
 
				   data: {},
			
 
				 });
			
@@ -38,16 +33,24 @@ async function getArticle() {
 
				     );
			
 
				     console.log("response", response.data.articles[0]);
			
 
				     list.data = response.data.articles[0];
			
 
				-    const fileData = response.data.articles[0].files;
			
 
				-    const fileObject = JSON.parse(fileData.replace(/'/g, '"')); // 字符串轉物件
			
 
				-
			
 
				-    // 遍歷物件後將值存進陣列
			
 
				-    file.list = Object.keys(fileObject).map((key) => ({
			
 
				-      name: fileObject[key].split("/").pop(),
			
 
				-      url: fileObject[key],
			
 
				-    }));
			
 
				+    // 附件
			
 
				+    const fileData = list.data.files;
			
 
				+    console.log("fileData", fileData);
			
 
				+    if (fileData !== "undefined") {
			
 
				+      const fileObject = JSON.parse(fileData.replace(/'/g, '"')); // 字符串轉物件
			
 
				+      // 遍歷物件後將值存進陣列
			
 
				+      file.list = Object.keys(fileObject).map((key) => ({
			
 
				+        name: fileObject[key].split("/").pop(),
			
 
				+        url: fileObject[key],
			
 
				+      }));
			
 
				+
			
 
				+      console.log("fileList", file.list);
			
 
				+    }
			
 
				+    // const fileObject = JSON.parse(fileData.replace(/'/g, '"')); // 字符串轉物件
			
 
				+    // 標籤
			
 
				+    tags.list = JSON.parse(list.data.tags);
			
 
				+    console.log("tags.list", tags.list);
			
 
				 
			
 
				-    console.log("fileList", file.list);
			
 
				     console.log("data", list.data);
			
 
				   } catch (error) {
			
 
				     console.error(error);
			
@@ -60,13 +63,17 @@ getArticle();
 
				 <template>
			
 
				   <Navbar />
			
 
				   <div class="position-relative mb-16">
			
 
				-    <img src="@/assets/img/news/news-01.png" alt="臺灣工藝學校全球學習共享平台" class="material-img" />
			
 
				+    <img
			
 
				+      src="@/assets/img/news/news-01.png"
			
 
				+      alt="臺灣工藝學校全球學習共享平台"
			
 
				+      class="material-img"
			
 
				+    />
			
 
				     <v-container class="pa-0 pt-16 position-relative">
			
 
				       <div class="content">
			
 
				         <div class="article">
			
 
				           <v-row>
			
 
				             <v-col cols="12">
			
 
				-              <div class="d-flex align-center mb-5">
			
 
				+              <div class="d-flex align-center mb-10">
			
 
				                 <v-chip size="large" variant="elevated" class="px-8 me-3">
			
 
				                   {{ list.data.group_sort }}
			
 
				                 </v-chip>
			
@@ -75,7 +82,7 @@ getArticle();
 
				                 </p>
			
 
				               </div>
			
 
				               <h2 class="text-center">{{ list.data.title }}</h2>
			
 
				-              <v-img
			
 
				+              <!-- <v-img
			
 
				                 class="cover-img my-10"
			
 
				                 :lazy-src="`https://ntcri.org/${list.data.cover_img}`"
			
 
				                 :src="`https://ntcri.org/${list.data.cover_img}`"
			
@@ -89,32 +96,48 @@ getArticle();
 
				                     ></v-progress-circular>
			
 
				                   </div>
			
 
				                 </template>
			
 
				-              </v-img>
			
 
				+              </v-img> -->
			
 
				             </v-col>
			
 
				             <v-col cols="12">
			
 
				-              <section class="d-flex flex-column pa-0">
			
 
				-                <p v-html="list.data.content"></p>
			
 
				-              </section>
			
 
				+              <section
			
 
				+                class="d-flex flex-column pa-0"
			
 
				+                v-html="list.data.content"
			
 
				+              ></section>
			
 
				             </v-col>
			
 
				-            <v-col cols="12" class="mt-10" v-if="file.list.length">
			
 
				-              <p>附件下載：</p>
			
 
				-              <ul class="mt-7">
			
 
				-                <li
			
 
				-                  v-for="(item, index) in file.list"
			
 
				-                  :key="index"
			
 
				-                  class="d-flex align-center mb-2"
			
 
				-                >
			
 
				-                  <v-icon
			
 
				-                    icon="mdi-file-download"
			
 
				-                    color="brown"
			
 
				-                    size="large"
			
 
				-                    class="me-2"
			
 
				-                  ></v-icon>
			
 
				-                  <a :href="`https://ntcri.org/${item.url}`" download>{{
			
 
				-                    item.name
			
 
				-                  }}</a>
			
 
				+            <v-col cols="12" class="mt-10">
			
 
				+              <ul class="d-flex mb-8 tag-list" v-if="tags.list">
			
 
				+                <li v-for="(item, index) in tags.list" :key="index">
			
 
				+                  <v-chip class="me-3" label variant="flat" color="blue">
			
 
				+                    <p class="text-white">{{ item }}</p>
			
 
				+                  </v-chip>
			
 
				                 </li>
			
 
				               </ul>
			
 
				+              <div
			
 
				+                v-if="file.list.length"
			
 
				+                class="d-flex flex-column align-start"
			
 
				+              >
			
 
				+                <p>附件下載：</p>
			
 
				+                <ul class="mt-7">
			
 
				+                  <li
			
 
				+                    v-for="(item, index) in file.list"
			
 
				+                    :key="index"
			
 
				+                    class="d-flex align-center mb-2"
			
 
				+                  >
			
 
				+                    <v-icon
			
 
				+                      icon="mdi-file-download"
			
 
				+                      color="brown"
			
 
				+                      size="large"
			
 
				+                      class="me-2"
			
 
				+                    ></v-icon>
			
 
				+                    <a
			
 
				+                      :href="`https://ntcri.org/${item.url}`"
			
 
				+                      download
			
 
				+                      target="_blank"
			
 
				+                      >{{ item.name }}</a
			
 
				+                    >
			
 
				+                  </li>
			
 
				+                </ul>
			
 
				+              </div>
			
 
				               <!-- <a :href="`https://ntcri.org/${filePath}`" download class="download-link">附件下載</a> -->
			
 
				             </v-col>
			
 
				           </v-row>
			
@@ -130,7 +153,11 @@ getArticle();
 
				     <a href="javascript:;" v-else @click="router.go(-1)" class="back-link"
			
 
				       >＜ 回到上一頁</a
			
 
				     >
			
 
				-    <img src="@/assets/img/news/news-01.png" alt="臺灣工藝學校全球學習共享平台" class="material-img" />
			
 
				+    <img
			
 
				+      src="@/assets/img/news/news-01.png"
			
 
				+      alt="臺灣工藝學校全球學習共享平台"
			
 
				+      class="material-img"
			
 
				+    />
			
 
				   </div>
			
 
				 </template>
			
 
				 
			
@@ -149,10 +176,6 @@ ul {
 
				     }
			
 
				   }
			
 
				 }
			
 
				-.btn-block {
			
 
				-  display: flex;
			
 
				-  justify-content: end;
			
 
				-}
			
 
				 
			
 
				 .content {
			
 
				   padding: 1.25em;
			
@@ -165,49 +188,7 @@ ul {
 
				     margin: auto;
			
 
				   }
			
 
				 }
			
 
				-.article {
			
 
				-  margin: auto;
			
 
				-  padding: 5em 3.125em;
			
 
				-  display: flex;
			
 
				-  justify-content: center;
			
 
				-  border: 0.0625em solid #d4d6d8;
			
 
				-  border-radius: 3.125em;
			
 
				 
			
 
				-  // @media (max-width: 960px) {
			
 
				-  //   width: 80%;
			
 
				-  // }
			
 
				-
			
 
				-  @media (max-width: 600px) {
			
 
				-    padding: 3.125em 0;
			
 
				-    border: none;
			
 
				-  }
			
 
				-
			
 
				-  h2 {
			
 
				-    font-size: 1.75em;
			
 
				-    font-weight: 500;
			
 
				-    line-height: 30.5em;
			
 
				-    letter-spacing: 0.125em;
			
 
				-  }
			
 
				-  section {
			
 
				-    height: 100%;
			
 
				-    padding: 1.875em;
			
 
				-    p {
			
 
				-      font-size: 1.125em;
			
 
				-      font-weight: 400;
			
 
				-      line-height: 2em;
			
 
				-      letter-spacing: 0.0625em;
			
 
				-      white-space: pre-line;
			
 
				-    }
			
 
				-  }
			
 
				-
			
 
				-  .cover-img {
			
 
				-    width: 100%;
			
 
				-    max-height: 31.25em;
			
 
				-    @media (max-width: 600px) {
			
 
				-      height: auto;
			
 
				-    }
			
 
				-  }
			
 
				-}
			
 
				 .bg-img {
			
 
				   height: 62.5em;
			
 
				   position: relative;
			
@@ -219,15 +200,8 @@ ul {
 
				 
			
 
				 .back-link {
			
 
				   margin-top: 3.125em;
			
 
				-  display: block;
			
 
				-  text-align: center;
			
 
				-  transition: all 0.3s;
			
 
				-  letter-spacing: 0.0625em;
			
 
				-
			
 
				-  &:hover {
			
 
				-    opacity: 0.8;
			
 
				-  }
			
 
				 }
			
 
				+
			
 
				 .material-img {
			
 
				   position: absolute;
			
 
				 
			
--- a/src/views/CollegeGroup/Cfa.vue
+++ b/src/views/CollegeGroup/Cfa.vue
@@ -170,7 +170,7 @@ getClass();
 
				   <v-row>
			
 
				     <v-col cols="12" md="6">
			
 
				       <p class="mb-5">
			
 
				-        以工藝為媒介，實踐社會價值功能。國立臺灣工藝研究發展中心啟動「臺灣綠工藝希望工程」，本於自然、循環、平衡、寬容、生命力等綠工藝精神，融合人文關懷，深化工藝與社會的互動連結，為所有人帶來「希望‧療癒‧陪伴」的力量。
			
 
				+        以工藝為媒介，實踐社會價值功能。臺灣工藝學校全球學習共享平台啟動「臺灣綠工藝希望工程」，本於自然、循環、平衡、寬容、生命力等綠工藝精神，融合人文關懷，深化工藝與社會的互動連結，為所有人帶來「希望‧療癒‧陪伴」的力量。
			
 
				       </p>
			
 
				       <p>
			
 
				         「臺灣綠工藝希望工程」是公民互助精神的體現，以「One Community, One
			
--- a/src/views/CollegeGroup/Cross.vue
+++ b/src/views/CollegeGroup/Cross.vue
@@ -297,15 +297,166 @@ async function handleSearch() {
 
				 
			
 
				   <p class="cooming-soon">「籌備中 cooming soon」</p>
			
 
				 
			
 
				-  <h2 class="title">臺灣工藝數位鏈</h2>
			
 
				+  <h2 class="title pb-10">臺灣工藝數位鏈</h2>
			
 
				+
			
 
				+  <div class="craftplus-item mb-6"></div>
			
 
				+
			
 
				+  <v-row class="pb-10 craftplus-block">
			
 
				+    <v-col cols="2">
			
 
				+      <ul class="category-list">
			
 
				+        <!-- <li v-for="(item, index) in categoryList" :key="index" class="mx-3">
			
 
				+          <router-link :to="item.path">
			
 
				+            {{ item.title }}
			
 
				+          </router-link>
			
 
				+        </li> -->
			
 
				+        <li class="mb-8">
			
 
				+          <img src="@/assets/img/craftplus-logo.png" alt="" />
			
 
				+        </li>
			
 
				+        <li>
			
 
				+          <a href="">合作需求</a>
			
 
				+        </li>
			
 
				+        <li>
			
 
				+          <a href="">活動企劃</a>
			
 
				+        </li>
			
 
				+        <li>
			
 
				+          <a href="">FAQ</a>
			
 
				+        </li>
			
 
				+      </ul>
			
 
				+    </v-col>
			
 
				+
			
 
				+    <v-col cols="10" class="work-list">
			
 
				+      <v-row>
			
 
				+        <v-col cols="4">
			
 
				+          <div class="item">
			
 
				+            <img src="@/assets/img/project/ProjectImage1.jpg" alt="" />
			
 
				+            <h3>作品名稱</h3>
			
 
				+            <span class="icon-list">
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-email-arrow-right"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-heart-outline"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-bookmark-outline"></v-icon>
			
 
				+              </button>
			
 
				+            </span>
			
 
				+          </div>
			
 
				+        </v-col>
			
 
				 
			
 
				-  <a
			
 
				+        <v-col cols="4">
			
 
				+          <div class="item">
			
 
				+            <img src="@/assets/img/project/ProjectImage2.jpg" alt="" />
			
 
				+            <h3>作品名稱</h3>
			
 
				+            <span class="icon-list">
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-email-arrow-right"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-heart-outline"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-bookmark-outline"></v-icon>
			
 
				+              </button>
			
 
				+            </span>
			
 
				+          </div>
			
 
				+        </v-col>
			
 
				+
			
 
				+        <v-col cols="4">
			
 
				+          <div class="item">
			
 
				+            <img src="@/assets/img/project/ProjectImage3.jpg" alt="" />
			
 
				+            <h3>作品名稱</h3>
			
 
				+            <span class="icon-list">
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-email-arrow-right"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-heart-outline"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-bookmark-outline"></v-icon>
			
 
				+              </button>
			
 
				+            </span>
			
 
				+          </div>
			
 
				+        </v-col>
			
 
				+
			
 
				+        <v-col cols="4">
			
 
				+          <div class="item">
			
 
				+            <img src="@/assets/img/project/ProjectImage7.jpg" alt="" />
			
 
				+            <h3>作品名稱</h3>
			
 
				+            <span class="icon-list">
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-email-arrow-right"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-heart-outline"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-bookmark-outline"></v-icon>
			
 
				+              </button>
			
 
				+            </span>
			
 
				+          </div>
			
 
				+        </v-col>
			
 
				+
			
 
				+        <v-col cols="4">
			
 
				+          <div class="item">
			
 
				+            <img src="@/assets/img/project/ProjectImage5.jpg" alt="" />
			
 
				+            <h3>作品名稱</h3>
			
 
				+            <span class="icon-list">
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-email-arrow-right"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-heart-outline"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-bookmark-outline"></v-icon>
			
 
				+              </button>
			
 
				+            </span>
			
 
				+          </div>
			
 
				+        </v-col>
			
 
				+
			
 
				+        <v-col cols="4">
			
 
				+          <div class="item">
			
 
				+            <img src="@/assets/img/project/ProjectImage6.jpg" alt="" />
			
 
				+            <h3>作品名稱</h3>
			
 
				+            <span class="icon-list">
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-email-arrow-right"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-heart-outline"></v-icon>
			
 
				+              </button>
			
 
				+
			
 
				+              <button>
			
 
				+                <v-icon icon="mdi-bookmark-outline"></v-icon>
			
 
				+              </button>
			
 
				+            </span>
			
 
				+          </div>
			
 
				+        </v-col>
			
 
				+      </v-row>
			
 
				+    </v-col>
			
 
				+  </v-row>
			
 
				+
			
 
				+  <!-- <div class="craftplus-item mt-16"></div> -->
			
 
				+
			
 
				+  <!-- <a
			
 
				     href="https://craftplus.ksi.com.tw/"
			
 
				     target="_blank"
			
 
				     class="craftplus-item"
			
 
				   >
			
 
				-    <!-- <img src="@/assets/img/college-group/cross.webp" alt="臺灣工藝數位鏈" /> -->
			
 
				-  </a>
			
 
				+  </a> -->
			
 
				 </template>
			
 
				 
			
 
				 <style lang="scss" scoped>
			
@@ -408,4 +559,69 @@ async function handleSearch() {
 
				     background-color: transparent;
			
 
				   }
			
 
				 }
			
 
				+
			
 
				+.tag-btn {
			
 
				+  // @media (max-width: 960px) {
			
 
				+  //   margin: auto !important;
			
 
				+  //   max-width: 18.75em;
			
 
				+  //   flex-direction: column;
			
 
				+  // }
			
 
				+
			
 
				+  .item {
			
 
				+    color: #009688;
			
 
				+    border: 0.0625em solid #009688;
			
 
				+
			
 
				+    &:hover {
			
 
				+      color: #fff;
			
 
				+      border-color: #009688;
			
 
				+      background-color: #009688;
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				+
			
 
				+.craftplus-block {
			
 
				+  .work-list {
			
 
				+    img {
			
 
				+      height: 280px;
			
 
				+    width: 100%;
			
 
				+    object-fit: cover;
			
 
				+      border-radius: 20px;
			
 
				+    }
			
 
				+
			
 
				+    .item {
			
 
				+      position: relative;
			
 
				+
			
 
				+      h3 {
			
 
				+        position: absolute;
			
 
				+        color: #fff;
			
 
				+        bottom: 8%;
			
 
				+        left: 5%;
			
 
				+        font-size: 1.25em;
			
 
				+        font-weight: 500;
			
 
				+        letter-spacing: 0.08em;
			
 
				+        text-shadow: 1px 1px 3px #333;
			
 
				+      }
			
 
				+
			
 
				+      .icon-list {
			
 
				+        display: flex;
			
 
				+        flex-direction: column;
			
 
				+        position: absolute;
			
 
				+        top: 5%;
			
 
				+        right: 5%;
			
 
				+        button {
			
 
				+          margin-bottom: 10px;
			
 
				+          font-size: 1.3em;
			
 
				+        }
			
 
				+        .v-icon {
			
 
				+          transition: all 0.3s;
			
 
				+          text-shadow: 1px 1px 3px #818181;
			
 
				+          color: #fff;
			
 
				+          &:hover {
			
 
				+            opacity: 0.6;
			
 
				+          }
			
 
				+        }
			
 
				+      }
			
 
				+    }
			
 
				+  }
			
 
				+}
			
 
				 </style>
			
--- a/src/views/CollegeGroup/Future.vue
+++ b/src/views/CollegeGroup/Future.vue
@@ -62,10 +62,10 @@ let read = reactive({
 
				         </span>
			
 
				         <span class="d-flex align-center">
			
 
				           <v-icon color="gray" icon="mdi-map-marker" class="me-2"></v-icon>
			
 
				-          國立臺灣工藝研究發展中心
			
 
				+          臺灣工藝學校全球學習共享平台
			
 
				         </span>
			
 
				         <p class="mt-8">
			
 
				-          國立臺灣工藝研究發展中心為實踐從總體經濟觀上思考整體工藝文化產業價值，及厚實臺灣工藝產業未來發展之國際文化競爭力，徵求類型含物件型研創、新材料研創、技術性研創、社會與環境議題研創等，申請團隊可提出相關實績說明或規畫構想，最高獲得
			
 
				+          臺灣工藝學校全球學習共享平台為實踐從總體經濟觀上思考整體工藝文化產業價值，及厚實臺灣工藝產業未來發展之國際文化競爭力，徵求類型含物件型研創、新材料研創、技術性研創、社會與環境議題研創等，申請團隊可提出相關實績說明或規畫構想，最高獲得
			
 
				           #新臺幣50萬元
			
 
				           補助，歡迎國內相關機構、產業、公司等法人或團體以及個人創作者等單位踴躍提案申請！
			
 
				         </p>
			
--- a/src/views/CollegeGroup/Life/Apprentice/Main.vue
+++ b/src/views/CollegeGroup/Life/Apprentice/Main.vue
@@ -84,28 +84,5 @@ const categoryList = reactive([
 
				     font-size: 1.25em;
			
 
				     font-weight: 500;
			
 
				   }
			
 
				-  .category-list {
			
 
				-    display: grid;
			
 
				-    grid-template-columns: repeat(auto-fit, minmax(9.0625em, max-content));
			
 
				-    justify-content: center;
			
 
				-    padding: initial;
			
 
				-    li {
			
 
				-      list-style-type: none;
			
 
				-      a {
			
 
				-        display: block;
			
 
				-        padding: 0.5em 1.25em;
			
 
				-        margin-bottom: 1.25em;
			
 
				-        border: 0.0625em solid #b8b8b8;
			
 
				-        border-radius: 0.3125em;
			
 
				-        letter-spacing: 0.0625em;
			
 
				-        line-height: 1.375em;
			
 
				-        text-align: center;
			
 
				-        transition: all 0.3s;
			
 
				-        &:hover {
			
 
				-          background-color: #f3f3f3;
			
 
				-        }
			
 
				-      }
			
 
				-    }
			
 
				-  }
			
 
				 }
			
 
				 </style>
			
--- a/src/views/CollegeGroup/Life/Shop.vue
+++ b/src/views/CollegeGroup/Life/Shop.vue
@@ -148,7 +148,7 @@ const youthImgs = [
 
				           <li>營業時間：週二至週日 09:00-20:00</li>
			
 
				           <li>週一休（逢國定假日及連續假期照常開館）</li>
			
 
				           <li>
			
 
				-            地點：國立臺灣工藝研究發展中心
			
 
				+            地點：臺灣工藝學校全球學習共享平台
			
 
				             生活工藝館一樓（南投縣草屯鎮中正路573號）
			
 
				           </li>
			
 
				         </ul>
			
--- a/src/views/CollegeGroup/Teenager.vue
+++ b/src/views/CollegeGroup/Teenager.vue
@@ -21,11 +21,11 @@ const breadcrumbs = reactive([
 
				 const testData = [
			
 
				   {
			
 
				     title:
			
 
				-      "國立臺灣工藝研究發展中心獎助博碩士生研撰臺灣工藝相關研究論文作業要點",
			
 
				+      "臺灣工藝學校全球學習共享平台獎助博碩士生研撰臺灣工藝相關研究論文作業要點",
			
 
				     date: "2023.08.26",
			
 
				     category: "工藝政策",
			
 
				     introduction:
			
 
				-      "國立臺灣工藝研究發展中心為提升臺灣工藝文化之主體性及營造工藝學領域發展環境，鼓勵國內大學校院培養工藝研究人才，發表研究成果，促使工藝升級、文化深耕，並建構相關資源支持體系，特訂定本要點，獎助內容如下：",
			
 
				+      "臺灣工藝學校全球學習共享平台為提升臺灣工藝文化之主體性及營造工藝學領域發展環境，鼓勵國內大學校院培養工藝研究人才，發表研究成果，促使工藝升級、文化深耕，並建構相關資源支持體系，特訂定本要點，獎助內容如下：",
			
 
				   },
			
 
				   {
			
 
				     title: "博碩士生研撰臺灣工藝相關研究論文獎助申請，申請至6月30日止",
			
--- a/src/views/CourseDetail.vue
+++ b/src/views/CourseDetail.vue
@@ -528,7 +528,7 @@ function isDateExpired(dateString) {
 
				                               <section class="consent">
			
 
				                                 <h4 class="text-center">個人資料使用同意書</h4>
			
 
				                                 <p>
			
 
				-                                  國立臺灣工藝研究發展中心〈以下簡稱工藝中心〉因辦理
			
 
				+                                  臺灣工藝學校全球學習共享平台〈以下簡稱工藝中心〉因辦理
			
 
				                                   <span class="font-weight-medium"
			
 
				                                     >【{{ item.class_name }}】</span
			
 
				                                   >
			
@@ -803,7 +803,7 @@ function isDateExpired(dateString) {
 
				                                     個人資料使用同意書
			
 
				                                   </h4>
			
 
				                                   <p>
			
 
				-                                    國立臺灣工藝研究發展中心〈以下簡稱工藝中心〉因辦理
			
 
				+                                    臺灣工藝學校全球學習共享平台〈以下簡稱工藝中心〉因辦理
			
 
				                                     <span class="font-weight-medium"
			
 
				                                       >【{{ item.class_name }}】</span
			
 
				                                     >
			
--- a/src/views/Courses/Create.vue
+++ b/src/views/Courses/Create.vue
--- a/src/views/Courses/Proposal.vue
+++ b/src/views/Courses/Proposal.vue
@@ -1741,24 +1741,24 @@ function removeTeacher(index) {
 
				     }
			
 
				   }
			
 
				 
			
 
				-  .notes-block {
			
 
				-    padding: 30px;
			
 
				-    font-size: 1.15em;
			
 
				-    color: #9b9b9b;
			
 
				-    background-color: #f9f9f9;
			
 
				-    border-radius: 5px;
			
 
				-    p,
			
 
				-    li {
			
 
				-      letter-spacing: 0.05em;
			
 
				-    }
			
 
				-    li {
			
 
				-      margin-bottom: 10px;
			
 
				-      line-height: 1.8em;
			
 
				-      &:last-child {
			
 
				-        margin-bottom: 0;
			
 
				-      }
			
 
				-    }
			
 
				-  }
			
 
				+  // .notes-block {
			
 
				+  //   padding: 30px;
			
 
				+  //   font-size: 1.15em;
			
 
				+  //   color: #9b9b9b;
			
 
				+  //   background-color: #f9f9f9;
			
 
				+  //   border-radius: 5px;
			
 
				+  //   p,
			
 
				+  //   li {
			
 
				+  //     letter-spacing: 0.05em;
			
 
				+  //   }
			
 
				+  //   li {
			
 
				+  //     margin-bottom: 10px;
			
 
				+  //     line-height: 1.8em;
			
 
				+  //     &:last-child {
			
 
				+  //       margin-bottom: 0;
			
 
				+  //     }
			
 
				+  //   }
			
 
				+  // }
			
 
				 
			
 
				   .upload-input {
			
 
				     .v-label {
			
--- a/src/views/Crafts.vue
+++ b/src/views/Crafts.vue
@@ -420,7 +420,7 @@ function handlePdfUrl(pdf) {
 
				         <div class="journal-content">
			
 
				           <p>
			
 
				             臺灣工藝學刊(Journal of
			
 
				-            Craftology｜Taiwan)是由中華民國文化部所屬國立臺灣工藝研究發展中心所出版之學術性半年刊，創立於2021年。
			
 
				+            Craftology｜Taiwan)是由中華民國文化部所屬臺灣工藝學校全球學習共享平台所出版之學術性半年刊，創立於2021年。
			
 
				             <br />
			
 
				             <br />
			
 
				             本刊企圖以工藝為問題意識核心，致力於工藝學跨領域思維整合之研究論文，內容涵蓋當代工藝多元價值論述，藝術與人文、社會及科學之跨領域發展整合、產生對話與交集，提供工藝研究交流平台，經由公開徵求工藝相關領域之研究論文稿件，旨在促進臺灣工藝文化主體與工藝產業發展的學術研究質量，建構國內工藝學知識體系，以提升國內工藝學術研究水準。
			
--- a/src/views/News.vue
+++ b/src/views/News.vue
@@ -196,6 +196,7 @@ const categoryList = reactive([
 
				             :key="index"
			
 
				             rounded="xl"
			
 
				             color="purple"
			
 
				+            variant="flat"
			
 
				             :class="{ 'me-5': index !== category.length - 1 }"
			
 
				             class="mb-5"
			
 
				             @click="filterCategory(item)"
			
--- a/src/views/NewsDetail.vue
+++ b/src/views/NewsDetail.vue
@@ -30,7 +30,11 @@ let loading = ref(false);
 
				 <template>
			
 
				   <Navbar />
			
 
				   <div class="position-relative">
			
 
				-    <img src="@/assets/img/news/news-01.png" alt="臺灣工藝學校全球學習共享平台" class="material-img" />
			
 
				+    <img
			
 
				+      src="@/assets/img/news/news-01.png"
			
 
				+      alt="臺灣工藝學校全球學習共享平台"
			
 
				+      class="material-img"
			
 
				+    />
			
 
				     <v-container class="pa-0 py-16 position-relative">
			
 
				       <div class="content">
			
 
				         <div v-if="loading" class="d-flex justify-center my-10">
			
@@ -43,7 +47,7 @@ let loading = ref(false);
 
				         <div v-else class="article">
			
 
				           <v-row>
			
 
				             <v-col cols="12">
			
 
				-              <div class="d-flex align-center mb-5">
			
 
				+              <div class="d-flex align-center mb-10">
			
 
				                 <v-chip size="large" variant="elevated" class="px-8 me-3">
			
 
				                   {{ news.data.category }}
			
 
				                 </v-chip>
			
@@ -77,16 +81,15 @@ let loading = ref(false);
 
				         >＜ 返回重要訊息</router-link
			
 
				       >
			
 
				     </v-container>
			
 
				-    <img src="@/assets/img/news/news-01.png" alt="臺灣工藝學校全球學習共享平台" class="material-img" />
			
 
				+    <img
			
 
				+      src="@/assets/img/news/news-01.png"
			
 
				+      alt="臺灣工藝學校全球學習共享平台"
			
 
				+      class="material-img"
			
 
				+    />
			
 
				   </div>
			
 
				 </template>
			
 
				 
			
 
				 <style lang="scss" scoped>
			
 
				-.btn-block {
			
 
				-  display: flex;
			
 
				-  justify-content: end;
			
 
				-}
			
 
				-
			
 
				 .content {
			
 
				   padding: 1.25em;
			
 
				   background-image: url("@/assets/img/news/news-02.png");
			
@@ -98,67 +101,7 @@ let loading = ref(false);
 
				     margin: auto;
			
 
				   }
			
 
				 }
			
 
				-.article {
			
 
				-  margin: auto;
			
 
				-  padding: 5em 3.125em;
			
 
				-  display: flex;
			
 
				-  justify-content: center;
			
 
				-  border: 0.0625em solid #d4d6d8;
			
 
				-  border-radius: 3.125em;
			
 
				-
			
 
				-  @media (max-width: 600px) {
			
 
				-    padding-top: 3.125em;
			
 
				-    border: none;
			
 
				-  }
			
 
				-
			
 
				-  h2 {
			
 
				-    font-size: 1.75em;
			
 
				-    font-weight: 500;
			
 
				-    line-height: 2.5em;
			
 
				-    letter-spacing: 0.125em;
			
 
				-  }
			
 
				-  section {
			
 
				-    height: 100%;
			
 
				-    padding: 1.875em;
			
 
				-  }
			
 
				-
			
 
				-  p,
			
 
				-  section {
			
 
				-    font-size: 1.125em;
			
 
				-    font-weight: 400;
			
 
				-    line-height: 2.25em;
			
 
				-    letter-spacing: 0.0625em;
			
 
				-    white-space: pre-line;
			
 
				-  }
			
 
				-
			
 
				-  .cover-img {
			
 
				-    width: 100%;
			
 
				-    height: 31.25em;
			
 
				-    object-fit: cover;
			
 
				-    @media (max-width: 600px) {
			
 
				-      height: auto;
			
 
				-    }
			
 
				-  }
			
 
				-}
			
 
				-.bg-img {
			
 
				-  height: 62.5em;
			
 
				-  position: relative;
			
 
				-  z-index: -1;
			
 
				-  @media (max-width: 600px) {
			
 
				-    height: 40.625em;
			
 
				-  }
			
 
				-}
			
 
				-
			
 
				-.back-link {
			
 
				-  display: block;
			
 
				-  text-align: center;
			
 
				-  transition: all 0.3s;
			
 
				-  letter-spacing: 0.0625em;
			
 
				 
			
 
				-  &:hover {
			
 
				-    opacity: 0.8;
			
 
				-  }
			
 
				-}
			
 
				 .material-img {
			
 
				   position: absolute;
			
 
				 
			
--- a/src/views/User/Courses.vue
+++ b/src/views/User/Courses.vue
@@ -529,13 +529,15 @@ let event = reactive({
 
				 });
			
 
				 
			
 
				 let eventType = ref(""); // 課程類型
			
 
				-let isOneDay = ref(true); // 是否為一日課程
			
 
				+let isOneDay = ref(null); // 是否為一日課程
			
 
				 
			
 
				 watch(eventType, (val) => {
			
 
				+  console.log("eventType", val);
			
 
				   if (val === "週期課程（例：2023/10/1～2023/10/30 每週一三上課）") {
			
 
				     isOneDay.value = false;
			
 
				   } else {
			
 
				     isOneDay.value = true;
			
 
				+    date.end_date = date.start_date;
			
 
				   }
			
 
				 });
			
 
				 
			
@@ -553,7 +555,7 @@ watch(event, (data) => {
 
				 
			
 
				 let date = reactive({
			
 
				   start_date: "", // 起始日期
			
 
				-  start_time: { hours: 13, minutes: 20, seconds: 0 }, // 起始時間
			
 
				+  start_time: "", // 起始時間
			
 
				   end_date: "", // 結束日期
			
 
				   end_time: "", // 結束時間
			
 
				   registration_start_date: "", // 報名起始日期
			
@@ -584,29 +586,30 @@ async function editEvent(id) {
 
				       // 處理時間
			
 
				       if (key === "start_time") {
			
 
				         date.start_time = dateToObject(classes[key]);
			
 
				-        date.start_date = classes[key].split("T")[0];
			
 
				+        date.start_date = store.convertUTCtoTaiwanTime(classes[key]);
			
 
				       }
			
 
				 
			
 
				       if (key === "end_time") {
			
 
				+        console.log("date.end_date !!!", date.end_date);
			
 
				         date.end_time = dateToObject(classes[key]);
			
 
				-        date.end_date = classes[key].split("T")[0];
			
 
				+        date.end_date = store.convertUTCtoTaiwanTime(classes[key]);
			
 
				+        console.log("date.end_date >>>", date.end_date);
			
 
				       }
			
 
				 
			
 
				       if (key === "registration_start") {
			
 
				         date.registration_start_time = dateToObject(classes[key]);
			
 
				-        date.registration_start_date = classes[key].split("T")[0];
			
 
				+        date.registration_start_date = store.convertUTCtoTaiwanTime(
			
 
				+          classes[key]
			
 
				+        );
			
 
				       }
			
 
				 
			
 
				       if (key === "registration_end") {
			
 
				         date.registration_end_time = dateToObject(classes[key]);
			
 
				-        date.registration_end_date = classes[key].split("T")[0];
			
 
				+        date.registration_end_date = store.convertUTCtoTaiwanTime(classes[key]);
			
 
				       }
			
 
				     }
			
 
				-
			
 
				+    console.log("處理完時間後>", date);
			
 
				     getAssignSession(event.id); // 取得課堂
			
 
				-    console.log("date", date);
			
 
				-
			
 
				-    console.log("event", event);
			
 
				   } catch (error) {
			
 
				     console.error(error);
			
 
				   }
			
@@ -666,6 +669,22 @@ async function getAssignSession(eventId) {
 
				     } else {
			
 
				       isOneDay.value = false;
			
 
				       eventType.value = "週期課程（例：2023/10/1～2023/10/30 每週一三上課）";
			
 
				+
			
 
				+      selectedWeek.value = response.data.data_form.week_day;
			
 
				+      console.log("selectedWeek.value", selectedWeek.value);
			
 
				+
			
 
				+      // 週期起始時間
			
 
				+      sessionTime.start_week_time = convertTimeArrays(
			
 
				+        response.data.data_form.start_week_time
			
 
				+      );
			
 
				+
			
 
				+      // 週期結束時間
			
 
				+      sessionTime.end_week_time = convertTimeArrays(
			
 
				+        response.data.data_form.end_week_time
			
 
				+      );
			
 
				+
			
 
				+      console.log("週期起始時間", sessionTime.start_week_time);
			
 
				+      console.log("週期結束時間", sessionTime.end_week_time);
			
 
				     }
			
 
				     console.log("event", event);
			
 
				     console.log("是否為一日課程", isOneDay.value);
			
@@ -675,6 +694,30 @@ async function getAssignSession(eventId) {
 
				   }
			
 
				 }
			
 
				 
			
 
				+// 若為一日課程則起始日期 = 結束日期
			
 
				+watch(date, (val) => {
			
 
				+  if (isOneDay.value && val.start_date) {
			
 
				+    date.end_date = val.start_date;
			
 
				+  }
			
 
				+});
			
 
				+
			
 
				+// 轉換週期時間格式
			
 
				+function convertTimeArrays(timeArrays) {
			
 
				+  return timeArrays.map((timeString) => {
			
 
				+    if (timeString === null) {
			
 
				+      return null;
			
 
				+    }
			
 
				+
			
 
				+    const [hours, minutes] = timeString.split(":").map(Number);
			
 
				+
			
 
				+    return {
			
 
				+      hours,
			
 
				+      minutes,
			
 
				+      seconds: 0,
			
 
				+    };
			
 
				+  });
			
 
				+}
			
 
				+
			
 
				 // 更新課堂
			
 
				 async function updateSession() {
			
 
				   console.log("更新課堂");
			
@@ -688,6 +731,44 @@ async function updateSession() {
 
				 
			
 
				   console.log("oneDayData", oneDayData);
			
 
				 
			
 
				+  // 週期課程(課堂資訊)
			
 
				+  const weekString = `[${selectedWeek.value.join(",")}]`;
			
 
				+  session.week_day_str = weekString;
			
 
				+
			
 
				+  console.log("weekString", weekString);
			
 
				+
			
 
				+  selectedWeek.value.map((item, index) => {
			
 
				+    if (item) {
			
 
				+      console.log("index", index);
			
 
				+      // 開始時間
			
 
				+      sessionStartTimeList.value[index] = `"${
			
 
				+        sessionTime.start_week_time[index].hours < 10 ? "0" : ""
			
 
				+      }${sessionTime.start_week_time[index].hours}:${
			
 
				+        sessionTime.start_week_time[index].minutes === 0
			
 
				+          ? "00"
			
 
				+          : sessionTime.start_week_time[index].minutes
			
 
				+      }:00"`;
			
 
				+
			
 
				+      // 結束時間
			
 
				+      sessionEndTimeList.value[index] = `"${
			
 
				+        sessionTime.end_week_time[index].hours
			
 
				+      }:${
			
 
				+        sessionTime.end_week_time[index].minutes === 0
			
 
				+          ? "00"
			
 
				+          : sessionTime.end_week_time[index].minutes
			
 
				+      }:00"`;
			
 
				+    } else {
			
 
				+      sessionStartTimeList.value[index] = '""';
			
 
				+      sessionEndTimeList.value[index] = '""';
			
 
				+    }
			
 
				+  });
			
 
				+
			
 
				+  session.start_week_time = `[${sessionStartTimeList.value}]`;
			
 
				+  session.end_week_time = `[${sessionEndTimeList.value}]`;
			
 
				+  session.class_event_id = event.id;
			
 
				+
			
 
				+  console.log("session", session);
			
 
				+
			
 
				   try {
			
 
				     if (isOneDay.value) {
			
 
				       const oneDayFormData = new FormData();
			
@@ -714,19 +795,39 @@ async function updateSession() {
 
				       );
			
 
				       console.log("新增課堂(週期) response", response);
			
 
				     }
			
 
				-    // const response = await axios.post(
			
 
				-    //   "https://cmm.ai:8088/api/auto_create_session",
			
 
				-    //   formData
			
 
				-    // );
			
 
				-    // console.log("新增課堂 response", response);
			
 
				   } catch (error) {
			
 
				     console.error(error);
			
 
				   }
			
 
				 }
			
 
				 
			
 
				+let dateReminder = ref(false);
			
 
				+
			
 
				+// 判斷兩組日期是否相同
			
 
				+function isSameDay(date1, date2) {
			
 
				+  const year1 = date1.getFullYear();
			
 
				+  const month1 = date1.getMonth() + 1;
			
 
				+  const day1 = date1.getDate();
			
 
				+
			
 
				+  const year2 = date2.getFullYear();
			
 
				+  const month2 = date2.getMonth() + 1;
			
 
				+  const day2 = date2.getDate();
			
 
				+
			
 
				+  return `${year1}${month1}${day1}` === `${year2}${month2}${day2}`;
			
 
				+}
			
 
				+
			
 
				 // 更新場次
			
 
				 async function updateEvent() {
			
 
				+  console.log("date", date);
			
 
				+
			
 
				+  let isSame = isSameDay(date.start_date, date.end_date);
			
 
				+  // 起始日期不可等於結束日期(週期課程)
			
 
				+  if (!isOneDay.value && isSame) {
			
 
				+    dateReminder.value = true;
			
 
				+    return;
			
 
				+  }
			
 
				+  dateReminder.value = false;
			
 
				   saveLoading.value = true;
			
 
				+
			
 
				   // 處理時間格式
			
 
				   event.start_time = store.mergeAndFormatDateTime(
			
 
				     date.start_date,
			
@@ -760,10 +861,6 @@ async function updateEvent() {
 
				       store.setAlert("儲存成功");
			
 
				     }, 1000);
			
 
				 
			
 
				-    // setTimeout(() => {
			
 
				-    //   // sessionsDialog.value = false;
			
 
				-    // }, 1500);
			
 
				-
			
 
				     console.log("更新場次", response);
			
 
				   } catch (error) {
			
 
				     console.error(error);
			
@@ -1157,21 +1254,13 @@ async function closeClass(id) {
 
				                 未審核
			
 
				               </v-chip>
			
 
				               <v-chip
			
 
				-                v-else-if="item.is_check === 1 && item.state !== '課程已關閉'"
			
 
				+                v-else-if="item.is_check === 1"
			
 
				                 color="green"
			
 
				                 text-color="white"
			
 
				               >
			
 
				                 已審核
			
 
				               </v-chip>
			
 
				 
			
 
				-              <v-chip
			
 
				-                v-else-if="item.is_check === 1 && item.state === '課程已關閉'"
			
 
				-                variant="flat"
			
 
				-                color="grey-darken-1"
			
 
				-              >
			
 
				-                已關閉
			
 
				-              </v-chip>
			
 
				-
			
 
				               <v-chip
			
 
				                 v-else-if="item.is_check === 2"
			
 
				                 color="error"
			
@@ -1179,6 +1268,14 @@ async function closeClass(id) {
 
				               >
			
 
				                 已駁回
			
 
				               </v-chip>
			
 
				+
			
 
				+              <v-chip
			
 
				+                v-else-if="item.is_check === 3"
			
 
				+                variant="flat"
			
 
				+                color="grey-darken-1"
			
 
				+              >
			
 
				+                已關閉
			
 
				+              </v-chip>
			
 
				             </td>
			
 
				             <td>{{ item.name }}</td>
			
 
				             <td>
			
@@ -1197,7 +1294,7 @@ async function closeClass(id) {
 
				                         v-bind="props"
			
 
				                         color="purple"
			
 
				                         variant="outlined"
			
 
				-                        :disabled="item.state === '課程已關閉'"
			
 
				+                        :disabled="item.is_check === 3"
			
 
				                       >
			
 
				                         <p>課程管理</p>
			
 
				                       </v-btn>
			
@@ -1854,7 +1951,10 @@ async function closeClass(id) {
 
				                                         cols="12"
			
 
				                                         class="d-flex py-0"
			
 
				                                       >
			
 
				-                                        <p class="pt-1 pe-3">
			
 
				+                                        <p
			
 
				+                                          class="pt-1 pe-3"
			
 
				+                                          style="width: 100px"
			
 
				+                                        >
			
 
				                                           重複週期<span class="mark pb-4"
			
 
				                                             >*</span
			
 
				                                           >
			
@@ -1934,7 +2034,11 @@ async function closeClass(id) {
 
				                                         />
			
 
				                                       </v-col>
			
 
				 
			
 
				-                                      <v-col cols="12" sm="6" class="date-item">
			
 
				+                                      <v-col
			
 
				+                                        cols="12"
			
 
				+                                        sm="6"
			
 
				+                                        class="date-item position-relative"
			
 
				+                                      >
			
 
				                                         <p class="mb-0 pe-3">
			
 
				                                           結束日期<span class="mark">*</span>
			
 
				                                         </p>
			
@@ -1944,7 +2048,13 @@ async function closeClass(id) {
 
				                                           :enable-time-picker="false"
			
 
				                                           :format="store.datePickerFormat"
			
 
				                                           locale="cn"
			
 
				+                                          :disabled="isOneDay"
			
 
				                                         ></VueDatePicker>
			
 
				+                                        <span
			
 
				+                                          v-if="dateReminder"
			
 
				+                                          class="date-reminder text-error"
			
 
				+                                          >選擇週期課程時，起始日期與結束日期不可為同一天</span
			
 
				+                                        >
			
 
				                                       </v-col>
			
 
				 
			
 
				                                       <v-col cols="12" sm="6" class="date-item">
			
@@ -2491,11 +2601,19 @@ async function closeClass(id) {
 
				   </v-card>
			
 
				 </template>
			
 
				 
			
 
				-<style lang="scss">
			
 
				+<style lang="scss" scoped>
			
 
				 .user-courses {
			
 
				   p,
			
 
				   a {
			
 
				     font-size: 0.8em;
			
 
				   }
			
 
				 }
			
 
				+
			
 
				+.date-reminder {
			
 
				+  position: absolute;
			
 
				+  bottom: -25px;
			
 
				+  left: 100px;
			
 
				+  font-size: 0.75em;
			
 
				+  line-height: 1.2;
			
 
				+}
			
 
				 </style>
			
--- a/src/views/User/Dashboard.vue
+++ b/src/views/User/Dashboard.vue
@@ -79,9 +79,9 @@ let items = [
 
				 
			
 
				 <template>
			
 
				   <Navbar />
			
 
				-  <v-container class="py-16 px-lg-0 dashboard-container">
			
 
				+  <v-container fluid class="pa-8 pa-sm-16 dashboard-container">
			
 
				     <v-row>
			
 
				-      <v-col cols="12" md="3">
			
 
				+      <v-col cols="12" md="2">
			
 
				         <v-card class="pa-5">
			
 
				           <div class="user-info">
			
 
				             <div class="img">
			
@@ -116,7 +116,7 @@ let items = [
 
				         </v-card>
			
 
				       </v-col>
			
 
				 
			
 
				-      <v-col cols="12" md="9">
			
 
				+      <v-col cols="12" md="10">
			
 
				         <router-view></router-view>
			
 
				       </v-col>
			
 
				     </v-row>
			
@@ -125,7 +125,9 @@ let items = [
 
				 
			
 
				 <style lang="scss">
			
 
				 .dashboard-container {
			
 
				+  max-width: 100% !important;
			
 
				   letter-spacing: 0.0625em;
			
 
				+
			
 
				   .title {
			
 
				     display: flex;
			
 
				     justify-content: center;
			
--- a/src/views/User/FavoriteClass.vue
+++ b/src/views/User/FavoriteClass.vue
@@ -110,7 +110,7 @@ const handleSearch = () => {
 
				           </router-link>
			
 
				         </v-col>
			
 
				         <v-col
			
 
				-          sm="6"
			
 
				+          sm="4"
			
 
				           cols="12"
			
 
				           v-for="(item, index) in favorites.list"
			
 
				           :key="index"
			
--- a/src/views/User/Passport.vue
+++ b/src/views/User/Passport.vue
@@ -62,7 +62,7 @@ function selectTag(btn) {
 
				     </p>
			
 
				 
			
 
				     <v-row class="main-info mt-10">
			
 
				-      <v-col cols="12" lg="6" class="d-flex flex-column align-center">
			
 
				+      <v-col cols="12" md="6" class="d-flex flex-column align-center">
			
 
				         <h5>累積學習<span>時數</span></h5>
			
 
				         <div class="d-flex align-center position-relative">
			
 
				           <p>
			
@@ -86,7 +86,7 @@ function selectTag(btn) {
 
				           </p>
			
 
				         </div>
			
 
				       </v-col>
			
 
				-      <v-col cols="12" lg="6" class="d-flex flex-column align-center">
			
 
				+      <v-col cols="12" md="6" class="d-flex flex-column align-center">
			
 
				         <h5>累積學習<span>點數</span></h5>
			
 
				         <div class="d-flex align-center position-relative">
			
 
				           <p>
			
@@ -130,32 +130,32 @@ function selectTag(btn) {
 
				         上課紀錄
			
 
				       </v-btn>
			
 
				     </div> -->
			
 
				+        <div class="d-flex flex-column flex-sm-row justify-center tab-btn mt-5">
			
 
				+          <v-btn
			
 
				+            variant="text"
			
 
				+            @click="selectTag('all')"
			
 
				+            :class="{ active: assignTag === 'all' }"
			
 
				+          >
			
 
				+            報名中課程
			
 
				+          </v-btn>
			
 
				+          <v-btn
			
 
				+            variant="text"
			
 
				+            @click="selectTag('0')"
			
 
				+            :class="{ active: assignTag === '0' }"
			
 
				+            class="mt-3 mt-sm-0"
			
 
				+          >
			
 
				+            上課紀錄
			
 
				+          </v-btn>
			
 
				+        </div>
			
 
				 
			
 
				         <div class="main-table">
			
 
				-          <div class="d-flex justify-center tab-btn mt-5">
			
 
				-            <v-btn
			
 
				-              variant="text"
			
 
				-              @click="selectTag('all')"
			
 
				-              :class="{ active: assignTag === 'all' }"
			
 
				-            >
			
 
				-              報名中課程
			
 
				-            </v-btn>
			
 
				-            <v-btn
			
 
				-              variant="text"
			
 
				-              @click="selectTag('0')"
			
 
				-              :class="{ active: assignTag === '0' }"
			
 
				-            >
			
 
				-              上課紀錄
			
 
				-            </v-btn>
			
 
				-          </div>
			
 
				-
			
 
				           <!-- <h6 class="table-title">報名中課程</h6> -->
			
 
				           <table>
			
 
				             <thead>
			
 
				               <tr>
			
 
				                 <th>報名日期</th>
			
 
				                 <th>課程名稱</th>
			
 
				-                <th width="150px">課程時間</th>
			
 
				+                <th width="180px">課程時間</th>
			
 
				                 <th width="110px">時數</th>
			
 
				                 <th width="10%">報名狀態</th>
			
 
				                 <!-- <th width="15%">繳款資訊</th> -->
			
@@ -172,7 +172,7 @@ function selectTag(btn) {
 
				                   {{ moment(`${item.create_time}`).format("YYYY/MM/DD") }}
			
 
				                 </td>
			
 
				                 <td>{{ item.class_name }}</td>
			
 
				-                <td class="time-item">
			
 
				+                <td>
			
 
				                   {{ moment(`${item.start_time}`).format("YYYY/MM/DD H:mm") }}
			
 
				                   <br />
			
 
				                   ～ <br />
			
@@ -184,7 +184,7 @@ function selectTag(btn) {
 
				                     <v-icon icon="mdi-check" class="pb-1"></v-icon>
			
 
				                   </span>
			
 
				 
			
 
				-                  <span v-else class="d-flex align-center">
			
 
				+                  <span v-else class="d-flex align-center justify-center">
			
 
				                     <p style="width: 55px" class="text-grey-lighten-1">
			
 
				                       審核中
			
 
				                     </p>
			
@@ -299,6 +299,10 @@ p {
 
				       transform: translate(-50%, -50%);
			
 
				       color: #fff;
			
 
				       font-size: 1.875em;
			
 
				+
			
 
				+      @media (max-width: 600px) {
			
 
				+        font-size: 1em;
			
 
				+      }
			
 
				     }
			
 
				     strong {
			
 
				       display: inline-block;
			
@@ -307,6 +311,7 @@ p {
 
				       font-weight: 500;
			
 
				       @media (max-width: 600px) {
			
 
				         font-size: 3.125em;
			
 
				+        margin: 0.3em 0 0.5em;
			
 
				       }
			
 
				     }
			
 
				     small {
			
@@ -337,9 +342,9 @@ table {
 
				     }
			
 
				   }
			
 
				 
			
 
				-  .time-item {
			
 
				-    font-size: 0.8em;
			
 
				-  }
			
 
				+  // .time-item {
			
 
				+  //   font-size: 0.8em;
			
 
				+  // }
			
 
				 
			
 
				   .finish-icon {
			
 
				     padding: 0.5em;
			
--- a/src/views/User/Profile.vue
+++ b/src/views/User/Profile.vue
@@ -281,13 +281,24 @@ let typeList = [
 
				   "鑑賞師",
			
 
				   "收藏家",
			
 
				 ];
			
 
				+
			
 
				+// 材質
			
 
				+let materialList = ["瓷土", "陶土","循環材料"];
			
 
				+// 技能
			
 
				+let technicalTypeList = ["陶藝","手擠坯", "手拉坏"];
			
 
				+// 技法
			
 
				+let technicalList = ["時尚", "家飾", "屏風", "雕塑", "陶板成形"];
			
 
				+// 機具
			
 
				+let productList = ["機具","織布"];
			
 
				 </script>
			
 
				 
			
 
				 <template>
			
 
				-  <v-card class="h-100 profile-card">
			
 
				+  <v-card class="h-100 px-10 profile-card">
			
 
				     <v-tabs v-model="tab" color="purple" align-tabs="center" class="mb-16">
			
 
				       <v-tab :value="1">關於我</v-tab>
			
 
				-      <v-tab v-if="isCrafts" :value="2">工藝教育者履歷</v-tab>
			
 
				+      <v-tab :value="2">創作者</v-tab>
			
 
				+      <v-tab :value="3">加工製造者</v-tab>
			
 
				+      <!-- <v-tab v-if="isCrafts" :value="2">工藝教育者履歷</v-tab> -->
			
 
				     </v-tabs>
			
 
				     <v-window v-model="tab">
			
 
				       <v-window-item :value="1">
			
@@ -395,7 +406,7 @@ let typeList = [
 
				 
			
 
				           <v-label>
			
 
				             <p class="d-flex my-5">手機號碼<span class="mark">*</span></p>
			
 
				-            <v-container class="pa-0">
			
 
				+            <v-container class="pa-0 mx-0" style="min-width: 100%">
			
 
				               <v-row>
			
 
				                 <v-col cols="12" md="3">
			
 
				                   <v-select
			
@@ -424,7 +435,7 @@ let typeList = [
 
				 
			
 
				           <v-label>
			
 
				             <p class="d-flex mb-5">現居地</p>
			
 
				-            <v-container class="pa-0">
			
 
				+            <v-container class="pa-0 mx-0" style="min-width: 100%">
			
 
				               <v-row>
			
 
				                 <v-col cols="12" md="3">
			
 
				                   <v-select
			
@@ -479,8 +490,332 @@ let typeList = [
 
				         </v-form>
			
 
				       </v-window-item>
			
 
				 
			
 
				-      <!-- 工藝教育者履歷 -->
			
 
				+      <!-- 創作者 -->
			
 
				       <v-window-item :value="2">
			
 
				+        <v-form @submit.prevent>
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">創作者名稱<span class="mark">*</span></p>
			
 
				+            <v-text-field
			
 
				+              :rules="[(v) => !!v || '請輸入您的姓名']"
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+              class="d-block"
			
 
				+            ></v-text-field>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">職稱</p>
			
 
				+            <v-text-field
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+              class="d-block"
			
 
				+              disabled
			
 
				+              >工藝家</v-text-field
			
 
				+            >
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">公司、工作室</p>
			
 
				+            <v-text-field
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+              class="d-block"
			
 
				+            ></v-text-field>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label>
			
 
				+            <p class="d-flex mb-5">關於我</p>
			
 
				+            <v-textarea rows="5" variant="outlined"></v-textarea>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-divider class="mt-10 mb-13"></v-divider>
			
 
				+
			
 
				+          <p class="text-h5 font-weight-bold">技能</p>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">擅長材質標籤</p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="materialList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-10">
			
 
				+            <p class="d-flex mb-5">擅長技能標籤</p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="technicalTypeList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-divider class="mt-15 mb-13"></v-divider>
			
 
				+
			
 
				+          <p class="text-h5 font-weight-bold">合作過的夥伴</p>
			
 
				+
			
 
				+          <ul class="mb-16">
			
 
				+            <li class="my-5">
			
 
				+              <v-btn color="purple" variant="outlined">
			
 
				+                <v-icon icon="mdi-plus" class="pt-1 pe-3"> </v-icon>
			
 
				+                <p>新增合作夥伴</p>
			
 
				+              </v-btn>
			
 
				+            </li>
			
 
				+            <li class="d-flex justify-space-between">
			
 
				+              <div>
			
 
				+                <p>李建佑</p>
			
 
				+                <p class="mt-2">其他加工製造商</p>
			
 
				+              </div>
			
 
				+              <span>
			
 
				+                <v-chip color="green"> 已通過 </v-chip>
			
 
				+              </span>
			
 
				+            </li>
			
 
				+          </ul>
			
 
				+
			
 
				+          <div class="d-flex justify-center mt-5 mb-10">
			
 
				+            <Transition>
			
 
				+              <v-alert
			
 
				+                v-if="alertState"
			
 
				+                type="success"
			
 
				+                variant="outlined"
			
 
				+                density="compact"
			
 
				+              >
			
 
				+                儲存成功
			
 
				+              </v-alert>
			
 
				+            </Transition>
			
 
				+
			
 
				+            <v-btn
			
 
				+              :loading="isLoading"
			
 
				+              variant="flat"
			
 
				+              color="purple"
			
 
				+              class="px-8"
			
 
				+              @click="saveResume()"
			
 
				+            >
			
 
				+              儲存
			
 
				+            </v-btn>
			
 
				+          </div>
			
 
				+        </v-form>
			
 
				+      </v-window-item>
			
 
				+
			
 
				+      <!-- 加工製造者 -->
			
 
				+      <v-window-item :value="3">
			
 
				+        <v-form @submit.prevent>
			
 
				+          <p class="text-h5 font-weight-bold">加工技法資訊</p>
			
 
				+
			
 
				+          <v-label class="mt-10">
			
 
				+            <p class="d-flex mb-5">技法名稱<span class="mark">*</span></p>
			
 
				+            <v-text-field
			
 
				+              :rules="[requiredRule]"
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+              class="d-block"
			
 
				+            ></v-text-field>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">描述<span class="mark">*</span></p>
			
 
				+            <v-textarea rows="5" variant="outlined"></v-textarea>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">技法類型</p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="technicalTypeList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">應用產品<span class="mark">*</span></p>
			
 
				+            <v-select
			
 
				+              :items="productList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">應用材質<span class="mark">*</span></p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="materialList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">製成機具<span class="mark">*</span></p>
			
 
				+            <v-select
			
 
				+              :items="productList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">
			
 
				+              技法標籤<span class="mark">*</span>（協助人們發現您的作品）
			
 
				+            </p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="technicalList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-divider class="mt-10 mb-13"></v-divider>
			
 
				+
			
 
				+          <p class="text-h5 font-weight-bold">合作案例資訊</p>
			
 
				+
			
 
				+          <v-label class="mt-10">
			
 
				+            <p class="d-flex mb-5">案例名稱<span class="mark">*</span></p>
			
 
				+            <v-text-field
			
 
				+              :rules="[requiredRule]"
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+              class="d-block"
			
 
				+            ></v-text-field>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">描述<span class="mark">*</span></p>
			
 
				+            <v-textarea rows="5" variant="outlined"></v-textarea>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">產品材質<span class="mark">*</span></p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="materialList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">應用技法<span class="mark">*</span></p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="technicalList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="mt-5">
			
 
				+            <p class="d-flex mb-5">生產數量<span class="mark">*</span></p>
			
 
				+            <v-text-field
			
 
				+              :rules="[requiredRule]"
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+              class="d-block"
			
 
				+              type="number"
			
 
				+            ></v-text-field>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <v-label class="my-5">
			
 
				+            <p class="d-flex mb-5">合作標籤<span class="mark">*</span></p>
			
 
				+
			
 
				+            <v-select
			
 
				+              :items="technicalList"
			
 
				+              multiple
			
 
				+              hide-details
			
 
				+              variant="outlined"
			
 
				+              density="compact"
			
 
				+            >
			
 
				+              <template #selection="{ item }">
			
 
				+                <v-chip color="purple" class="me-1">{{ item.title }}</v-chip>
			
 
				+              </template>
			
 
				+            </v-select>
			
 
				+          </v-label>
			
 
				+
			
 
				+          <div class="d-flex justify-center mt-5 mb-10">
			
 
				+            <Transition>
			
 
				+              <v-alert
			
 
				+                v-if="alertState"
			
 
				+                type="success"
			
 
				+                variant="outlined"
			
 
				+                density="compact"
			
 
				+              >
			
 
				+                儲存成功
			
 
				+              </v-alert>
			
 
				+            </Transition>
			
 
				+
			
 
				+            <v-btn
			
 
				+              :loading="isLoading"
			
 
				+              variant="flat"
			
 
				+              color="purple"
			
 
				+              class="px-8"
			
 
				+              @click="saveResume()"
			
 
				+            >
			
 
				+              儲存
			
 
				+            </v-btn>
			
 
				+          </div>
			
 
				+        </v-form>
			
 
				+      </v-window-item>
			
 
				+
			
 
				+      <!-- 工藝教育者履歷 -->
			
 
				+      <!-- <v-window-item :value="2">
			
 
				         <v-form @submit.prevent>
			
 
				           <v-label class="mt-5">
			
 
				             <p class="d-flex mb-5">工藝教育者姓名<span class="mark">*</span></p>
			
@@ -578,9 +913,6 @@ let typeList = [
 
				               </v-alert>
			
 
				             </Transition>
			
 
				 
			
 
				-            <!-- <v-btn variant="outlined" color="grey-lighten-1" class="me-3">
			
 
				-              捨棄變更
			
 
				-            </v-btn> -->
			
 
				             <v-btn
			
 
				               :loading="isLoading"
			
 
				               variant="flat"
			
@@ -592,7 +924,7 @@ let typeList = [
 
				             </v-btn>
			
 
				           </div>
			
 
				         </v-form>
			
 
				-      </v-window-item>
			
 
				+      </v-window-item> -->
			
 
				     </v-window>
			
 
				 
			
 
				     <!-- <div class="title">