新增健管師並顯示

layouts/default.vue

@@ -570,36 +570,45 @@ async function logout() {
   });
 }
 
+// 🔐 Token 狀態管理（確保 SSR 不報錯）
+const authToken = useState("authToken", () => process.client ? localStorage.getItem("token_TCM") || "" : "");
 
-var token; // 加上分號
+// 🔍 檢查 Token
-const token_check = ()=>{
+const token_check = async () => {
-  // 检查本地存储中是否存在JWT令牌
+  if (!process.client) return; // 確保只在 client-side 執行
-  token = localStorage.getItem("token_TCM");
+
-  console.log(token);
+  const token = localStorage.getItem("token_TCM");
-  // 確認有無token
+  console.log("Token:", token);
-  if (token != null) {
+
-    $.ajax({
+  if (!token) {
-      type: "GET",
+    console.log("無 Token，轉跳首頁");
-      url: $api_host + "/Users/token_check_user",
+    router.push("/Home_pages/");
+    return;
+  }
+
+  try {
+    const response = await fetch(`${$api_host}/Users/token_check_user`, {
+      method: "GET",
       headers: {
         Authorization: token,
       },
-      success: function (response) {
-        // 若層級為8 則無法登入
-        if(response.level<=8 ){
-          router.push("/Home_pages/");
-        }
-      },
-      error: function (xhr) {
-        console.log(xhr);
-      },
     });
-  } else {
+
-    console.log("pass");
+    if (!response.ok) throw new Error("Token 驗證失敗");
+
+    const data = await response.json();
+    console.log("驗證成功:", data);
+
+    // 若 level ≤ 8 則轉跳首頁
+    if (data.level <= 8) {
+      router.push("/Home_pages/");
+    }
+  } catch (error) {
+    console.error("Token 驗證失敗", error);
     router.push("/Home_pages/");
   }
-}
+};
 
-// 自啟
+// 🔄 在頁面載入時執行
 onMounted(token_check);
 </script>

layouts/defaultmanager.vue

@@ -568,36 +568,46 @@ async function logout() {
   });
 }
 
-var token; // 加上分號
+// 🔐 Token 狀態管理（確保 SSR 不報錯）
-const token_check = ()=>{
+const authToken = useState("authToken", () => process.client ? localStorage.getItem("token_TCM") || "" : "");
-  // 检查本地存储中是否存在JWT令牌
+
-  token = localStorage.getItem("token_TCM");
+// 🔍 檢查 Token
-  console.log(token);
+const token_check = async () => {
-  // 確認有無token
+  if (!process.client) return; // 確保只在 client-side 執行
-  if (token != null) {
+
-    $.ajax({
+  const token = localStorage.getItem("token_TCM");
-      type: "GET",
+  console.log("Token:", token);
-      url: $api_host + "/Users/token_check_user",
+
+  if (!token) {
+    console.log("無 Token，轉跳首頁");
+    router.push("/Home_pages/");
+    return;
+  }
+
+  try {
+    const response = await fetch(`${$api_host}/Users/token_check_user`, {
+      method: "GET",
       headers: {
         Authorization: token,
       },
-      success: function (response) {
-        // 若層級為8 則無法登入
-        if(response.level<=6 ){
-          router.push("/Home_pages/");
-        }
-      },
-      error: function (xhr) {
-        console.log(xhr);
-      },
     });
-  } else {
+
-    console.log("pass");
+    if (!response.ok) throw new Error("Token 驗證失敗");
+
+    const data = await response.json();
+    console.log("驗證成功:", data);
+
+    // 若 level ≤ 6 則轉跳首頁
+    if (data.level <= 6) {
+      router.push("/Home_pages/");
+    }
+  } catch (error) {
+    console.error("Token 驗證失敗", error);
     router.push("/Home_pages/");
   }
-}
+};
 
-
+// 🔄 在頁面載入時執行
-// 自啟
 onMounted(token_check);
+
 </script>

pages/Lamiter_pages/Company-[guid].vue

@@ -41,7 +41,7 @@
             </div>
             <div  class="form-group">
                 <label>是否啟用</label>
-                <select style="width:100%"  v-model="Enable_ON">
+                <select style="width:100%"  >
                     <option value="Y">Y</option>
                     <option value="N">N</option>
                 </select>
@@ -65,7 +65,8 @@ import { ref, onMounted } from 'vue'
 import { useRouter } from "vue-router"; //匯入路徑
 const { $api_host } = useNuxtApp(); //匯入API host
 const router = useRouter(); // 匯入
-
+// 🔐 定義全域 token
+const authToken = ref("");
 
 
 //編輯企業
@@ -80,32 +81,57 @@ function close_edit_Company_view() {
     edit_Company_view.value?.close();
 }
 
-const company_name=ref("");
+
 //獲取資料
 const get_data = async () => {
-    const now_route = useRoute(); // 取得當前路由資訊
+    const Company_data = await get_company_data()
-    const company_guid = now_route.params.guid
+    set_Company(Company_data);
+};
+
+
+// 獲取公司資料
+const get_company_data= async () =>{
+    const route = useRoute(); // 取得當前路由資訊
+    const company_guid = route.params.guid; // 提取路由中的 guid 參數
+
+    // 確保 company_guid 存在
+    if (!company_guid) {
+        console.error("沒有找到公司 GUID！");
+        return;
+    }
+
     try {
-        const response = await fetch(`${$api_host}/api/Company_detail_table/get_campany-${company_guid}`, {
+        const response = await $fetch(`${$api_host}/api/Company_detail_table/get_campany-${company_guid}`, {
             method: "GET",
             headers: {
                 "Content-Type": "application/json",
+                Authorization: authToken.value, // 假設 authToken 已經在其他地方定義
             },
         });
-        if (!response.ok) throw new Error(`HTTP 錯誤! 狀態碼: ${response.status}`);
-
-        const data = await response.json();
-        company_name.value=data.company_name
-
 
+        console.log("✅ 獲取成功", response);
+        return response
     } catch (error) {
         console.error("獲取公司資料失敗:", error);
     }
 
+}
 
-};
+//設置資料
+const company_name=ref("");
+const set_Company=(data)=>{
+    company_name.value =data.company_name
+}
 
 
 // 自啟
-onMounted(get_data);
+// 🚀 在 mounted 時獲取 token
+onMounted(() => {
+    if (process.client) {
+        // 讀取 localStorage 並將 token 設置到 reactive 變數中
+        authToken.value = localStorage.getItem("token_TCM") || "";
+    }
+
+    get_data(); // 確保 token 讀取後再調用 API
+});
 </script>

pages/Lamiter_pages/Company_Control_page.vue

@@ -28,7 +28,7 @@
     </div>
 
 
-    
+
 
     <!--新增企業-彈跳視窗-->
     <div>
@@ -69,24 +69,27 @@
     </div>
 </template>
 
-<script setup >
+<script setup>
 import { ref, onMounted } from 'vue'
 import { useRouter } from "vue-router"; //匯入路徑
 const { $api_host } = useNuxtApp(); //匯入API host
 const router = useRouter(); // 匯入
+// 🔐 定義全域 token
+const authToken = ref("");
+
+
 
 const add_Company_view = ref(null);
-
 //新增企業
-async function add_company() {
+const add_company = async () => {
-    companyName.value ="";
+    companyName.value = "";
     companyPhone.value = "";
-    companyaccount.value ="";
+    companyaccount.value = "";
     companypassword.value = "";
     add_Company_view.value?.showModal();
 }
 //關閉 <新增企業-彈跳視窗>
-function close_add_Company_view() {
+const close_add_Company_view = () => {
     add_Company_view.value?.close();
 }
 
@@ -96,60 +99,91 @@ const companyName = ref("");
 const companyPhone = ref("");
 const companyaccount = ref("");
 const companypassword = ref("");
-async function submitCompany() {
+const submitCompany = async () => {
-    
+
     try {
         const companyData = {
-            lastname:companyName.value,
+            lastname: companyName.value,
-            username: companyaccount.value, 
+            username: companyaccount.value,
-            password: companypassword.value 
+            password: companypassword.value
         };
         console.log(companyData)
 
         const response = await fetch(`${$api_host}/api/Company_detail_table/Add_campany`, {
             method: 'POST',
             headers: {
-                'Content-Type': 'application/json'
+                'Content-Type': 'application/json',
+                Authorization: authToken.value,
             },
             body: JSON.stringify(companyData)
         });
-
-        if (!response.ok) {
-            throw new Error(`HTTP error! Status: ${response.status}`);
-        }
         add_Company_view.value?.close();
         alert('上傳成功！');
         get_data();
     } catch (error) {
         alert('上傳失敗，請檢查後端！');
     }
-    
+
 }
 
 
-//獲取資料
-const companies = ref([]);
-const get_data = async () => {
-  try {
-    const response = await fetch(`${$api_host}/api/Company_detail_table/get_all_campany`);
-    if (!response.ok) throw new Error(`HTTP 錯誤! 狀態碼: ${response.status}`);
 
-    const data = await response.json();
+//獲取資料
-    companies.value = data; // 更新公司列表
+const get_data = async () => {
-  } catch (error) {
+    const All_Companies = await get_All_Companies();//獲取公司資訊
-    console.error('獲取公司資料失敗:', error);
+    set_All_Companies_data(All_Companies);
-  }
+}
+
+
+
+// 📌 獲取公司資訊
+const get_All_Companies = async () => {
+    if (!process.client) return; // 確保只在 client-side 執行
+
+    //const token = localStorage.getItem("token_TCM");
+    try {
+        const response = await $fetch(`${$api_host}/api/Company_detail_table/get_all_campany`, {
+            method: "GET",
+            headers: {
+                "Content-Type": "application/json",
+                Authorization: authToken.value,
+            },
+        });
+
+        console.log("✅ 獲取成功", response);
+        return response
+    } catch (error) {
+        console.error("🔴 獲取公司資料失敗", error);
+    }
 };
 
+
+// 設定資料
+const companies = ref([]);
+const set_All_Companies_data = (data) => {
+    console.log(data)
+    companies.value = data; // 更新公司列表
+}
+
+
+
 //編輯資料
-async function edit_company(guid){
+const edit_company = async (guid) => {
     console.log(guid)
-    router.push("/Lamiter_pages/Company-"+guid);
+    router.push("/Lamiter_pages/Company-" + guid);
 }
 
 
 // 自啟
-onMounted(get_data);
+// 🚀 在 mounted 時獲取 token
+onMounted(() => {
+    if (process.client) {
+        // 讀取 localStorage 並將 token 設置到 reactive 變數中
+        authToken.value = localStorage.getItem("token_TCM") || "";
+    }
+
+    get_data(); // 確保 token 讀取後再調用 API
+});
 </script>
 
 

pages/Manage_pages/Health_Control_page.vue

@@ -5,15 +5,15 @@
         </button>
         <br /><br />
         <div class="row">
-            <div v-for="healther in healthers" :key="health.guid" class="col-xl-3 col-md-6 mb-4">
+            <div v-for="healther in healthers" :key="healther.guid" class="col-xl-3 col-md-6 mb-4">
-                <div class="card border-left-primary shadow h-100 py-2" @click="edit_health(health.guid)">
+                <div class="card border-left-primary shadow h-100 py-2" @click="edit_health(healther.guid)">
                     <div class="card-body">
                         <div class="row no-gutters align-items-center">
                             <div class="col mr-2">
                                 <div class="text-xs font-weight-bold text-primary text-uppercase mb-1">
                                     健管師名稱：
                                 </div>
-                                <div class="h5 mb-0 font-weight-bold text-gray-800">{{ health.health_name }}</div>
+                                <div class="h5 mb-0 font-weight-bold text-gray-800">{{ healther.health_name }}</div>
                             </div>
                             <div class="col-auto">
                                 <i class="fas fa-user-tie fa-2x text-gray-300"></i> <!-- 改為人圖標 -->
@@ -68,6 +68,8 @@ import { ref, onMounted } from 'vue'
 import { useRouter } from "vue-router"; //匯入路徑
 const { $api_host } = useNuxtApp(); //匯入API host
 const router = useRouter(); // 匯入
+const authToken = ref("");// 🔐 定義全域 token
+
 const add_Health_view = ref(null);
 
 definePageMeta({
@@ -75,7 +77,7 @@ definePageMeta({
 })
 
 //新增健管師
-async function add_health_manager() {
+const add_health_manager = async () => {
     healthName.value = "";
     healthPhone.value = "";
     healthaccount.value = "";
@@ -84,7 +86,7 @@ async function add_health_manager() {
 }
 
 //關閉 <新增健管師-彈跳視窗>
-function close_add_Health_view() {
+const close_add_Health_view = () => {
     add_Health_view.value?.close();
 }
 
@@ -93,31 +95,30 @@ const healthName = ref("");
 const healthPhone = ref("");
 const healthaccount = ref("");
 const healthpassword = ref("");
-async function submitCompany() {
+const submitHealth = async () => {
 
     try {
         const healthData = {
-            lastname: companyName.value,
+            lastname: healthName.value,
-            username: companyaccount.value,
+            username: healthaccount.value,
-            password: companypassword.value
+            password: healthpassword.value,
+            company_guid: company_guid.value
         };
-        console.log(companyData)
+        console.log(healthData)
 
-        const response = await fetch(`${$api_host}/api/Company_detail_table/Add_campany`, {
+        const response = await $fetch(`${$api_host}/api/Health_detail_table/Add_health`, {
             method: 'POST',
             headers: {
-                'Content-Type': 'application/json'
+                'Content-Type': 'application/json',
+                Authorization: authToken.value,
             },
-            body: JSON.stringify(companyData)
+            body: JSON.stringify(healthData)
         });
-
+        add_Health_view.value?.close();
-        if (!response.ok) {
-            throw new Error(`HTTP error! Status: ${response.status}`);
-        }
-        add_Company_view.value?.close();
         alert('上傳成功！');
         get_data();
     } catch (error) {
+        console.error(error);
         alert('上傳失敗，請檢查後端！');
     }
 
@@ -125,42 +126,72 @@ async function submitCompany() {
 
 
 
-const company_guid = ref ("")
+const company_guid = ref("") //企業GUID
 //獲取資料
 const get_data = async () => {
-    const authToken = useState("authToken", () => process.client ? localStorage.getItem("token_TCM") || "" : "");
+    await get_company_basic_data();
-    console.log(authToken)
+    const All_Health_data = await get_all_health_data();
-   await get_company_basic_data()
+    set_All_Health_data(All_Health_data);
-   await get_all_health_data()
 }
+
 // 獲取企業基礎資料
 const get_company_basic_data = async () => {
     try {
 
-        const response = await fetch(`${$api_host}/Users/token_check_user`, {
+        const response = await $fetch(`${$api_host}/Users/token_check_user`, {
+            method: 'GET',
             headers: {
-                Authorization: token,
+                "Content-Type": "application/json",
+                Authorization: authToken.value,
             },
         });
-        if (!response.ok) throw new Error(`HTTP 錯誤! 狀態碼: ${response.status}`);
+        company_guid.value = response.guid
-        const data = await response.json();
-        company_guid.value = data.guid
     } catch (error) {
         console.error('企業基礎資料失敗:', error);
     }
 }
+
 // 獲取所有健康管理師資料
-const get_all_health_data = async()=>{
+const get_all_health_data = async () => {
-    console.log(company_guid.value)
+
+    try {
+        const response = await $fetch(`${$api_host}/api/Health_detail_table/get_company_all_health-${company_guid.value}`, {
+            method: 'GET',
+            headers: {
+                "Content-Type": "application/json",
+                Authorization: authToken.value,
+            },
+        });
+        return response;
+    } catch (error) {
+        console.error(error);
+    }
+}
+
+//設置資料
+const healthers = ref([]);
+const set_All_Health_data = (data) => {
+    console.log(data)
+    healthers.value = data
 }
 
 
-// 自啟
-onMounted(get_data);
 
+// 自啟
+// 🚀 在 mounted 時獲取 token
+onMounted(() => {
+    if (process.client) {
+        // 讀取 localStorage 並將 token 設置到 reactive 變數中
+        authToken.value = localStorage.getItem("token_TCM") || "";
+    }
+
+    get_data(); // 確保 token 讀取後再調用 API
+});
 </script>
 
 
+
+
 <style>
 /* 簡單美化對話框 */
 .dialog-box {

pages/index.vue

@@ -1,26 +1,23 @@
 <template></template>
 
 <script setup>
-import { useHead } from "#app"; //匯入Head
+import { useHead } from "#app"; // 匯入 Head
-import { ref } from "vue";
+import { ref, onMounted } from "vue"; // 開機自啟
-import { onMounted } from "vue"; //開機自啟
+import { useRouter } from "vue-router"; // 匯入路由
-import { useRouter } from "vue-router"; //匯入路徑
+const { $api_host } = useNuxtApp(); // 匯入 API host
-const { $api_host } = useNuxtApp(); //匯入API host
+const router = useRouter(); // 匯入路由
-const router = useRouter(); // 匯入
 
 definePageMeta({
   layout: false, // 禁用 layout
 });
 
+// 設置 Head
 useHead({
   title: "Lamiter",
   meta: [
     { charset: "utf-8" },
     { "http-equiv": "X-UA-Compatible", content: "IE=edge" },
-    {
+    { name: "viewport", content: "width=device-width, initial-scale=1, shrink-to-fit=no" },
-      name: "viewport",
-      content: "width=device-width, initial-scale=1, shrink-to-fit=no",
-    },
     { name: "description", content: "" },
     { name: "author", content: "" },
   ],
@@ -28,12 +25,11 @@ useHead({
     {
       rel: "stylesheet",
       href: "https://fonts.googleapis.com/css?family=Nunito:200,200i,300,300i,400,400i,600,600i,700,700i,800,800i,900,900i",
-    }, // 確保 `styles.css` 位於 public/css 資料夾中
+    },
     { rel: "stylesheet", href: "/css/sb-admin-2.min.css" },
     { rel: "stylesheet", href: "/vendor/fontawesome-free/css/all.min.css" },
   ],
   script: [
-    //{ src: 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js', crossorigin: 'anonymous' },
     { src: "/vendor/jquery/jquery.min.js" },
     { src: "/vendor/bootstrap/js/bootstrap.bundle.min.js" },
     { src: "/vendor/jquery-easing/jquery.easing.min.js" },
@@ -41,44 +37,47 @@ useHead({
   ],
 });
 
-console.log($api_host);
+// 🔐 Token 狀態管理（確保 SSR 不報錯）
-var token; // 加上分號
+const authToken = useState("authToken", () => process.client ? localStorage.getItem("token_TCM") || "" : "");
 
-//檢查token
+// 🔍 檢查 Token
-function token_check() {
+async function token_check() {
-  // 检查本地存储中是否存在JWT令牌
+  if (!process.client) return; // 確保在 client-side 執行
-  token = localStorage.getItem("token_TCM");
+
-  console.log(token);
+  const token = localStorage.getItem("token_TCM");
-  // 確認有無token
+  console.log("Token:", token);
-  if (token != null) {
+
-    $.ajax({
+  if (!token) {
-      type: "GET",
+    console.log("無 Token，轉跳首頁");
-      url: $api_host + "/Users/token_check_user",
+    router.push("/Home_pages/");
+    return;
+  }
+
+  try {
+    const response = await fetch(`${$api_host}/Users/token_check_user`, {
+      method: "GET",
       headers: {
         Authorization: token,
       },
-      success: function (response) {
-        // 若層級為10 為BOSS
-        if(response.level>=9){
-          router.push("/Lamiter_pages/");
-        }
-        // 若層級為9 為管理階層上層
-        if(response.level==8){
-          router.push("/Manage_pages/");
-        }
-      },
-      error: function (xhr) {
-        console.log("false");
-      },
     });
-  } else {
+
-    console.log("pass");
+    if (!response.ok) throw new Error("Token 驗證失敗");
+
+    const data = await response.json();
+    console.log("驗證成功:", data);
+
+    if (data.level >= 9) {
+      router.push("/Lamiter_pages/");
+    } else if (data.level == 8) {
+      router.push("/Manage_pages/");
+    }
+  } catch (error) {
+    console.error("Token 驗證失敗", error);
     router.push("/Home_pages/");
   }
 }
 
-//開機自啟
+// 🔄 開機執行
-onMounted(() => {
+onMounted(token_check);
-  token_check();
-});
 </script>
+