up

layouts/default.vue

@@ -53,7 +53,7 @@
             aria-controls="collapseTwo"
           >
             <i class="fas fa-fw fa-cog"></i>
-            <span>Components</span>
+            <span>設定</span>
           </a>
           <div
             id="collapseTwo"
@@ -62,10 +62,10 @@
             data-parent="#accordionSidebar"
           >
             <div class="bg-white py-2 collapse-inner rounded">
-              <h6 class="collapse-header">Custom Components:</h6>
+              <h6 class="collapse-header">企業設定</h6>
-              <a class="collapse-item" href="buttons.html">Buttons</a>
+              <a class="collapse-item" href="/Lamiter_pages/Company_Control_page">企業管理</a>
-              <a class="collapse-item" href="cards.html">Cards</a>
             </div>
+            
           </div>
         </li>
 
@@ -532,6 +532,7 @@
 </template>
 
 <script setup>
+import { ref, onMounted } from 'vue'
 import { useHead } from "#app";
 import { useRouter } from "vue-router"; //匯入路徑
 const { $api_host } = useNuxtApp(); //匯入API host
@@ -568,4 +569,37 @@ async function logout() {
     window.location.reload();
   });
 }
+
+
+var token; // 加上分號
+const token_check = ()=>{
+  // 检查本地存储中是否存在JWT令牌
+  token = localStorage.getItem("token_TCM");
+  console.log(token);
+  // 確認有無token
+  if (token != null) {
+    $.ajax({
+      type: "GET",
+      url: $api_host + "/Users/token_check_user",
+      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");
+    router.push("/Home_pages/");
+  }
+}
+
+// 自啟
+onMounted(token_check);
 </script>

layouts/defaultmanager.vue

@@ -568,4 +568,37 @@ async function logout() {
     window.location.reload();
   });
 }
+
+var token; // 加上分號
+const token_check = ()=>{
+  // 检查本地存储中是否存在JWT令牌
+  token = localStorage.getItem("token_TCM");
+  console.log(token);
+  // 確認有無token
+  if (token != null) {
+    $.ajax({
+      type: "GET",
+      url: $api_host + "/Users/token_check_user",
+      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");
+    router.push("/Home_pages/");
+  }
+}
+
+
+// 自啟
+onMounted(token_check);
 </script>

package-lock.json

@@ -7,6 +7,7 @@
       "name": "nuxt-app",
       "hasInstallScript": true,
       "dependencies": {
+        "bootstrap": "^5.3.3",
         "nuxt": "^3.15.2",
         "vue": "latest",
         "vue-router": "latest"
@@ -1881,6 +1882,17 @@
       "integrity": "sha512-8LduaNlMZGwdZ6qWrKlfa+2M4gahzFkprZiAt2TF8uS0qQgBizKXpXURqvTJ4WtmupWxaLqjRb2UCTe72mu+Aw==",
       "license": "MIT"
     },
+    "node_modules/@popperjs/core": {
+      "version": "2.11.8",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
+      "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
+      "license": "MIT",
+      "peer": true,
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/popperjs"
+      }
+    },
     "node_modules/@redocly/ajv": {
       "version": "8.11.2",
       "resolved": "https://registry.npmjs.org/@redocly/ajv/-/ajv-8.11.2.tgz",
@@ -3222,6 +3234,25 @@
       "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
       "license": "ISC"
     },
+    "node_modules/bootstrap": {
+      "version": "5.3.3",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.3.3.tgz",
+      "integrity": "sha512-8HLCdWgyoMguSO9o+aH+iuZ+aht+mzW0u3HIMzVu7Srrpv7EBBxTnrFlSCskwdY1+EOFQSm7uMJhNQHkdPcmjg==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/twbs"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/bootstrap"
+        }
+      ],
+      "license": "MIT",
+      "peerDependencies": {
+        "@popperjs/core": "^2.11.8"
+      }
+    },
     "node_modules/brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",

package.json

@@ -10,6 +10,7 @@
     "postinstall": "nuxt prepare"
   },
   "dependencies": {
+    "bootstrap": "^5.3.3",
     "nuxt": "^3.15.2",
     "vue": "latest",
     "vue-router": "latest"

pages/Lamiter_pages/Company-[guid].vue

@@ -0,0 +1,108 @@
+<template>
+    <div>
+        <h2>企業名稱 : {{ company_name }}</h2>
+        <!-- 操作按鈕 -->
+        <div style="height:30px;float:right ">
+            <button class="btn btn-outline-warning" @click="edit_show">編輯資料</button>
+        </div>
+
+    </div>
+
+
+
+<!--編輯企業-彈跳視窗---->
+<div>
+    <dialog ref="edit_Company_view" class="dialog-box">
+            <div><button class="btn btn-danger" style="float:right" @click="close_edit_show">關閉</button>
+                <h2>編輯企業</h2>
+
+            </div>
+
+            <!-- 表單內容 -->
+            <div class="form-group">
+                <label for="companyName">企業名稱：</label>
+                <input id="companyName" v-model="companyName" type="text" class="form-control" placeholder="請輸入企業名稱">
+            </div>
+
+
+            <div class="form-group">
+                <label for="companyPhone">聯絡電話：</label>
+                <input id="companyPhone" v-model="companyPhone" type="tel" class="form-control" placeholder="請輸入聯絡電話">
+            </div>
+            <div class="form-group">
+                <label for="companyPhone">預設帳號：</label>
+                <input id="companyPhone" v-model="companyaccount" type="text" class="form-control"
+                    placeholder="請輸入預設帳號">
+            </div>
+            <div class="form-group">
+                <label for="companyPhone">預設密碼：</label>
+                <input id="companyPhone" v-model="companypassword" type="text" class="form-control"
+                    placeholder="請輸入預設密碼">
+            </div>
+            <div  class="form-group">
+                <label>是否啟用</label>
+                <select style="width:100%"  v-model="Enable_ON">
+                    <option value="Y">Y</option>
+                    <option value="N">N</option>
+                </select>
+            </div>
+            <!-- 操作按鈕 -->
+            <div class="button-group">
+                <button class="btn btn-success" @click="submitCompany">確認</button>
+            </div>
+
+        </dialog>
+</div>
+
+</template>
+
+
+
+
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useRouter } from "vue-router"; //匯入路徑
+const { $api_host } = useNuxtApp(); //匯入API host
+const router = useRouter(); // 匯入
+
+
+
+//編輯企業
+const edit_Company_view = ref(null);
+async function edit_show() {
+    
+    edit_Company_view.value?.showModal();
+}
+
+
+
+const company_name=ref("");
+//獲取資料
+const get_data = async () => {
+    const now_route = useRoute(); // 取得當前路由資訊
+    const company_guid = now_route.params.guid
+    try {
+        const response = await fetch(`${$api_host}/api/Company_detail_table/get_campany-${company_guid}`, {
+            method: "GET",
+            headers: {
+                "Content-Type": "application/json",
+            },
+        });
+        if (!response.ok) throw new Error(`HTTP 錯誤! 狀態碼: ${response.status}`);
+
+        const data = await response.json();
+        company_name.value=data.campant_name
+
+
+    } catch (error) {
+        console.error("獲取公司資料失敗:", error);
+    }
+
+
+};
+
+
+// 自啟
+onMounted(get_data);
+</script>

pages/Lamiter_pages/Company_Control_page.vue

@@ -0,0 +1,185 @@
+<template>
+    <div>
+        <button type="button" class="btn btn-primary" @click="add_company">
+            新增企業
+        </button>
+
+        <br /><br />
+
+        <div class="row">
+            <div v-for="company in companies" :key="company.guid" class="col-xl-3 col-md-6 mb-4">
+                <div class="card border-left-primary shadow h-100 py-2" @click="edit_company(company.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">{{ company.campant_name }}</div>
+                            </div>
+                            <div class="col-auto">
+                                <i class="fas fa-building fa-2x text-gray-300"></i> <!-- 改為企業圖標 -->
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+
+
+    
+
+    <!--新增企業-彈跳視窗-->
+    <div>
+        <dialog ref="add_Company_view" class="dialog-box">
+            <div><button class="btn btn-danger" style="float:right" @click="close_add_Company_view">關閉</button>
+                <h2>新增企業</h2>
+
+            </div>
+
+            <!-- 表單內容 -->
+            <div class="form-group">
+                <label for="companyName">企業名稱：</label>
+                <input id="companyName" v-model="companyName" type="text" class="form-control" placeholder="請輸入企業名稱">
+            </div>
+
+
+            <div class="form-group">
+                <label for="companyPhone">聯絡電話：</label>
+                <input id="companyPhone" v-model="companyPhone" type="tel" class="form-control" placeholder="請輸入聯絡電話">
+            </div>
+            <div class="form-group">
+                <label for="companyPhone">預設帳號：</label>
+                <input id="companyPhone" v-model="companyaccount" type="text" class="form-control"
+                    placeholder="請輸入預設帳號">
+            </div>
+            <div class="form-group">
+                <label for="companyPhone">預設密碼：</label>
+                <input id="companyPhone" v-model="companypassword" type="text" class="form-control"
+                    placeholder="請輸入預設密碼">
+            </div>
+
+            <!-- 操作按鈕 -->
+            <div class="button-group">
+                <button class="btn btn-success" @click="submitCompany">確認</button>
+            </div>
+
+        </dialog>
+    </div>
+</template>
+
+<script setup >
+import { ref, onMounted } from 'vue'
+import { useRouter } from "vue-router"; //匯入路徑
+const { $api_host } = useNuxtApp(); //匯入API host
+const router = useRouter(); // 匯入
+
+const add_Company_view = ref(null);
+
+//新增企業
+async function add_company() {
+    companyName.value ="";
+    companyPhone.value = "";
+    companyaccount.value ="";
+    companypassword.value = "";
+    add_Company_view.value?.showModal();
+}
+//關閉 <新增企業-彈跳視窗>
+function close_add_Company_view() {
+    add_Company_view.value?.close();
+}
+
+
+// 上傳企業基本資料
+const companyName = ref("");
+const companyPhone = ref("");
+const companyaccount = ref("");
+const companypassword = ref("");
+async function submitCompany() {
+    
+    try {
+        const companyData = {
+            lastname:companyName.value,
+            username: companyaccount.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'
+            },
+            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('http://localhost:5291/api/Company_detail_table/get_all_campany');
+    if (!response.ok) throw new Error(`HTTP 錯誤! 狀態碼: ${response.status}`);
+
+    const data = await response.json();
+    companies.value = data; // 更新公司列表
+  } catch (error) {
+    console.error('獲取公司資料失敗:', error);
+  }
+};
+
+//編輯資料
+async function edit_company(guid){
+    console.log(guid)
+    router.push("/Lamiter_pages/Company-"+guid);
+}
+
+
+// 自啟
+onMounted(get_data);
+</script>
+
+
+
+
+<style>
+/* 簡單美化對話框 */
+.dialog-box {
+    width: 50%;
+    padding: 20px;
+    border-radius: 8px;
+    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
+}
+
+.form-group {
+    margin-bottom: 10px;
+}
+
+.form-control {
+    width: 100%;
+    padding: 8px;
+    margin-top: 5px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+}
+
+.button-group {
+    display: flex;
+    justify-content: center;
+    /* 讓按鈕水平置中 */
+    margin-top: 15px;
+}
+</style>

pages/index.vue

@@ -59,11 +59,11 @@ function token_check() {
       },
       success: function (response) {
         // 若層級為10 為BOSS
-        if(response.level==10){
+        if(response.level>=9){
           router.push("/Lamiter_pages/");
         }
         // 若層級為9 為管理階層上層
-        if(response.level==9){
+        if(response.level==8){
           router.push("/Manage_pages/");
         }
       },