diff --git a/controllers/StaffController.js b/controllers/StaffController.js
index 222f914d5f3e6d9c8a1e15764a3e7fb1f2b2b48d..2c93e59b3ddc5f1ce7cc3228131e7ed66be89914 100644
--- a/controllers/StaffController.js
+++ b/controllers/StaffController.js
@@ -66,7 +66,7 @@ const updateStaff = async(req, res, next) => {
     const staffResult = await staffModel.findOneBy('id',id);
     if(staffResult == null) return res.status(404).send("Not Found.");
 
-    await staffModel.updateBy('id',id,{ name,role,user_id: user_id == 0 ? null : user_id });
+    await staffModel.updateBy('id',id,{ name,role: !role || role == undefined ? staffResult.role : role,user_id: user_id == 0 ? null : user_id });
 
     res.redirect("/staff/manage/" + id);
 };
diff --git a/controllers/TableController.js b/controllers/TableController.js
index 831b55f68064d3f1781aacfa0c368f8d7cadeb30..2c433f39edc20106d82066b1f4114653ce4674f2 100644
--- a/controllers/TableController.js
+++ b/controllers/TableController.js
@@ -2,15 +2,23 @@ const Auth = require("../models/auth");
 const Table = require("../models/table");
 const TableStatus = require("../models/tablestatus");
 const TableTypes = require("../models/tabletypes");
+const User = require("../models/user");
 
 const tableModel = new Table();
 const tableTypesModel = new TableTypes();
 const tableStatusModel = new TableStatus();
+const userModel = new User();
 
 
 const showIndex = async(req, res, next) => {
+    const { query } = req.query;
     const authResult = await Auth.getSessionData(req.session.token); 
-    const tableResult = await tableModel.findAllJoinTypes() || [ ];
+    var tableResult;
+    if(!query) {
+        tableResult = await tableModel.findAllJoinTypesUsers() || [ ];
+    }
+    else tableResult = await tableModel.searchJoinTypes(query) || [ ];
+    
     const tableStatusResult = await tableStatusModel.findAll() || [ ];
 
     res.render("restaurant/table/index",{ role: authResult.role,tableResult: tableResult,tableStatusData: tableStatusResult });
@@ -27,20 +35,24 @@ const showCreate = async(req, res, next) => {
 const showManage = async(req, res, next) => {
     const { id } = req.params;
     const authResult = await Auth.getSessionData(req.session.token); 
-    const tableResult = await tableModel.findOneJoinTypesByID(id) || [ ];
+    const tableResult = await tableModel.findOneJoinTypesUsersByID(id) || [ ];
     if(tableResult == null) return res.status(404).send("Not Found.");
     const tableTypesResult = await tableTypesModel.findAll() || [ ];
     const tableStatusResult = await tableStatusModel.findAll() || [ ];
+    const usersResult = await userModel.findAll() || [ ];
 
-    res.render("restaurant/table/manage",{ role: authResult.role,tableData: tableResult,tableTypeData: tableTypesResult,tableStatusData: tableStatusResult });
+    console.log(tableResult);
+
+    res.render("restaurant/table/manage",{ role: authResult.role,tableData: tableResult,tableTypeData: tableTypesResult,tableStatusData: tableStatusResult,usersData: usersResult });
 };
 
 const updateTable = async(req, res, next) => {
-    const { id,table_number,table_type,table_status } = req.body;
+    const { id,table_number,table_type,table_status,user_id } = req.body;
+    console.log(id);
     const tableResult = await tableModel.findOneBy('id',id);
     if(tableResult == null) return res.status(404).send("Not Found.");
 
-    await tableModel.updateBy('id',id,{ table_number, table_type, table_status });
+    await tableModel.updateBy('id',id,{ table_number, table_type, table_status,user_id: user_id == 0 ? null : user_id });
 
     res.redirect("/table/manage/" + id);
 };
diff --git a/models/table.js b/models/table.js
index ed011969abf95806465b43e31b1db7586d8c0ac0..c875a954eefc7abf018597e20ccb3a80f1c1de25 100644
--- a/models/table.js
+++ b/models/table.js
@@ -5,20 +5,31 @@ class Table extends SQLModel {
     constructor() {
         super("tables");
     }
-    async findAllJoinTypes() {
-        let query = `SELECT tt.id AS type_id,tt.*,tb.* FROM ${this.tableName} AS tb JOIN table_types AS tt ON tb.table_type = tt.id WHERE 1`;
+    async findAllJoinTypesUsers() {
+        let query = `SELECT tt.id AS type_id, tt.*, tb.*, u.phone_number FROM ${this.tableName} AS tb JOIN table_types AS tt ON tb.table_type = tt.id LEFT JOIN users AS u ON tb.user_id = u.id WHERE 1;`;
     
         const [result] = await db.mysql.query(query);
         if (!result || result.length == 0) return null;
         return result;
     }
-    async findOneJoinTypesByID(id) {
-        let query = `SELECT tt.id AS type_id,tb.* FROM ${this.tableName} AS tb JOIN table_types AS tt ON tb.table_type = tt.id WHERE tb.id = ?`;
+    async findOneJoinTypesUsersByID(id) {
+        let query = `SELECT tt.id AS type_id, tb.*, u.phone_number FROM ${this.tableName} AS tb JOIN table_types AS tt ON tb.table_type = tt.id LEFT JOIN users AS u ON tb.user_id = u.id WHERE tb.id = ?`;
     
         const [result] = await db.mysql.query(query,[id]);
         if (!result || result.length == 0) return null;
         return result[0];
     }
+    async searchJoinTypes(value, orderBy = null) {
+        let query = `SELECT tt.id AS type_id,tt.*,tb.* FROM ${this.tableName} AS tb JOIN table_types AS tt ON tb.table_type = tt.id WHERE tb.table_number LIKE ? OR tb.table_type LIKE ? OR tt.description LIKE ?`;
+        
+        if (orderBy) {
+            query += ` ORDER BY ${orderBy}`;
+        }
+        
+        const [result] = await db.mysql.query(query, [`%${value}%`,`%${value}%`,`%${value}%`]);
+        if (!result || result.length == 0) return null;
+        return result;
+    }
 };
 
 module.exports = Table;
\ No newline at end of file
diff --git a/views/queue/track.ejs b/views/queue/track.ejs
index a0efdb7413cdf6e3ec01091e97190ca24fe70716..3633e1b082df1f744f831b426cbcf8bb9085fb58 100644
--- a/views/queue/track.ejs
+++ b/views/queue/track.ejs
@@ -19,7 +19,7 @@
                 <p class="card-text">เธงเธฑเธ™เน€เธงเธฅเธฒเธ—เธตเนˆเธˆเธญเธ‡: <span id="queue-date"></span></p>
                 <p class="card-text">เธ›เธฃเธฐเน€เธ เธ—เน‚เธ•เนŠเธฐ: <span id="queue-table"></span></p>
                 <p class="card-text">เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡: <span id="queue-size"></span></p>
-                <a href="#" class="btn btn-primary wh-100">Go somewhere</a>
+                <!-- <a href="#" class="btn btn-primary wh-100">Go somewhere</a> -->
             </div>
         </div>
     </div>    
diff --git a/views/restaurant/index.ejs b/views/restaurant/index.ejs
index 4dc0af360d918280ec5d2555992cbeadf7b52076..84546c8926356b45032a658ef9e22d9ffdc04e1f 100644
--- a/views/restaurant/index.ejs
+++ b/views/restaurant/index.ejs
@@ -17,7 +17,7 @@
     <!-- Centered block container -->
     <div class="mx-5 d-flex justify-content-center align-items-center" style="height: 40vh;">
         <div class="row row-cols-3 g-3"> <!-- Grid with 3 columns -->
-            <% if(role === "Administrator") { %>
+            <% if(role === "Administrator" || role === "Reception") { %>
                 <!-- <div class="col">
                     <a href="/table">
                         <div class="bg-success text-white d-flex flex-column justify-content-center align-items-center mx-5" style="width: 100px; height: 120px;">
diff --git a/views/restaurant/staff/manage.ejs b/views/restaurant/staff/manage.ejs
index 5e2f9fabb7f075d7f018ec3a6467b0d42e88542c..9b12f08bb57e8831af6e2e5cbf220729b04d0f8e 100644
--- a/views/restaurant/staff/manage.ejs
+++ b/views/restaurant/staff/manage.ejs
@@ -38,7 +38,7 @@
             <label for="role">เธ•เธณเนเธซเธ™เนˆเธ‡</label>
             <select id="role" name="role" class="form-control" <%= isSelf == true ? "disabled" : "" %>>
               <% rolesData.forEach(element=> { %>
-                <option value="<%= element.name %>" <%=staffData.role==element.role ? 'selected' : '' %>><%= element.name %></option>
+                <option value="<%= element.name %>" <%=staffData.role == element.name ? 'selected' : '' %>><%= element.name %></option>
                 <% }) %>
             </select>
           </div>
@@ -50,7 +50,6 @@
                 <option value="<%= element.id %>" <%=staffData.user_id==element.id ? 'selected' : '' %>>(<%= element.id %>) <%= element.phone_number %></option>
             <% }) %>
             </select>
-            <!-- <input type="text" class="form-control" name="user_id" id="user_id" placeholder="เธเธฃเธญเธเน„เธญเธ”เธตเธšเธฑเธเธŠเธตเธœเธนเน‰เนƒเธŠเน‰เธ‚เธญเธ‡เธžเธ™เธฑเธเธ‡เธฒเธ™" value="<%= staffData.user_id %>"> -->
           </div>
           <div class="form-group">
             <label for="phone_number">เน€เธšเธญเธฃเนŒเน‚เธ—เธฃเธจเธฑเธžเธ—เนŒ</label>
diff --git a/views/restaurant/table/create.ejs b/views/restaurant/table/create.ejs
index df870b63a074e532860156c3e5d45d0127d2ab2e..9c04bb46c4e98b99a0f40c7565463c07fe4a1101 100644
--- a/views/restaurant/table/create.ejs
+++ b/views/restaurant/table/create.ejs
@@ -27,7 +27,7 @@
         <form method="POST" action="/table/create">
           <div class="form-group">
             <label for="table_number">เธซเธกเธฒเธขเน€เธฅเธ‚เน‚เธ•เนŠเธฐ</label>
-            <input type="number" class="form-control" name="table_number" id="table_number" placeholder="เธซเธกเธฒเธขเน€เธฅเธ‚เธ‚เธญเธ‡เน‚เธ•เนŠเธฐ">
+            <input type="number" class="form-control" name="table_number" id="table_number" placeholder="เธซเธกเธฒเธขเน€เธฅเธ‚เธ‚เธญเธ‡เน‚เธ•เนŠเธฐ" required>
           </div>
           <div class="form-group">
             <label for="table_type">เธ›เธฃเธฐเน€เธ เธ—เน‚เธ•เนŠเธฐ</label>
diff --git a/views/restaurant/table/index.ejs b/views/restaurant/table/index.ejs
index e2522deeca36f4333fb472eee42187f7b10cf113..ff84a2c8ac332e72f0fcbb18ee02c8c263d4d6be 100644
--- a/views/restaurant/table/index.ejs
+++ b/views/restaurant/table/index.ejs
@@ -22,11 +22,17 @@
           </div>
         <div class="container px-3 py-3">
             <h5>เธˆเธฑเธ”เธเธฒเธฃเน‚เธ•เนŠเธฐเธ เธฒเธขเนƒเธ™เธฃเน‰เธฒเธ™</h5>
-            <table class="table table-dark">
+            <form action="/table" method="GET" class="input-group flex-grow-1">
+              <span class="input-group-text"><i class="fa fa-magnifying-glass"></i></span>
+              <input type="text" class="form-control" name="query" placeholder="เธ„เน‰เธ™เธซเธฒเธˆเธฒเธเธซเธกเธฒเธขเน€เธฅเธ‚เธซเธฃเธทเธญเธ›เธฃเธฐเน€เธ เธ—เน‚เธ•เนŠเธฐ" aria-label="searchinput">
+            </form>  
+            <table class="table table-dark my-2">
                 <thead>
                   <tr>
                     <th scope="col">เธซเธกเธฒเธขเน€เธฅเธ‚เน‚เธ•เนŠเธฐ</th>
                     <th scope="col">เธ›เธฃเธฐเน€เธ เธ—เน‚เธ•เนŠเธฐ</th>
+                    <th scope="col">เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡</th>
+                    <th scope="col">เธœเธนเน‰เนƒเธŠเน‰เธ—เธตเนˆเธเธณเธฅเธฑเธ‡เนƒเธŠเน‰เธ‡เธฒเธ™</th>
                     <th scope="col">เธชเธ–เธฒเธ™เธฐ</th>
                   </tr>
                 </thead>
@@ -34,7 +40,13 @@
                     <% tableResult.forEach(element => { %>
                     <tr onclick="window.location.href='/table/manage/<%= element.id %>'">
                         <th scope="row"><%= element.table_number %></th>
-                        <td>(<%= element.type_id %>) <%= element.description %> | <%= element.capacity_min %> - <%= element.capacity_max %> เธ„เธ™</td>
+                        <td>(<%= element.type_id %>) <%= element.description %></td>
+                        <td><%= element.capacity_min %> - <%= element.capacity_max %> เธ„เธ™</td>
+                        <% if (element.user_id != null) { %>
+                        <td>(<%= element.user_id %>) <%= element.phone_number %></td>
+                        <% } else {%>
+                          <td></td>
+                        <% } %>
                         <td><%= tableStatusData[element.table_status].name %></td>
                     </tr>
                     <% }) %>
diff --git a/views/restaurant/table/manage.ejs b/views/restaurant/table/manage.ejs
index df5d018380a29198be786a18a76b47bd9a0b7437..b298304276c5fcba22a3adb33a3dc5de06f463da 100644
--- a/views/restaurant/table/manage.ejs
+++ b/views/restaurant/table/manage.ejs
@@ -33,7 +33,7 @@
           <div class="form-group">
             <label for="table_number">เธซเธกเธฒเธขเน€เธฅเธ‚เน‚เธ•เนŠเธฐ</label>
             <input type="number" class="form-control" name="table_number" id="table_number" placeholder="เธซเธกเธฒเธขเน€เธฅเธ‚เธ‚เธญเธ‡เน‚เธ•เนŠเธฐ"
-              value="<%= tableData.table_number %>">
+              value="<%= tableData.table_number %>" required>
           </div>
           <div class="form-group">
             <label for="table_type">เธ›เธฃเธฐเน€เธ เธ—เน‚เธ•เนŠเธฐ</label>
@@ -51,6 +51,15 @@
                 <% }) %>
             </select>
           </div>
+          <div class="form-group">
+            <label for="user_id">เธšเธฑเธเธŠเธตเธœเธนเน‰เนƒเธŠเน‰</label>
+            <select id="user_id" name="user_id" class="form-control">
+              <option value="0" <%=tableData.user_id==null ? 'selected' : '' %>>เน„เธกเนˆเธฃเธฐเธšเธธ</option>
+              <% usersData.forEach(element=> { %>
+                <option value="<%= element.id %>" <%=tableData.user_id==element.id ? 'selected' : '' %>>(<%= element.id %>) <%= element.phone_number %></option>
+            <% }) %>
+            </select>
+          </div>
           <button type="submit" class="my-2 btn btn-success">เธšเธฑเธ™เธ—เธถเธ</button>
         </form>
       </div>
diff --git a/views/restaurant/tabletype/create.ejs b/views/restaurant/tabletype/create.ejs
index 1ca1b3cc0f3ee6a6675f309d4feabb305230683c..93353906177684f5c06209fdc947782bf12405ad 100644
--- a/views/restaurant/tabletype/create.ejs
+++ b/views/restaurant/tabletype/create.ejs
@@ -27,19 +27,19 @@
         <form method="POST" action="/tabletype/create">
           <div class="form-group">
             <label for="id">เธฃเธซเธฑเธชเธ‚เธญเธ‡เธ›เธฃเธฐเน€เธ เธ—</label>
-            <input type="text" class="form-control" name="id" id="id" placeholder="เธฃเธซเธฑเธชเธ‚เธญเธ‡เธ›เธฃเธฐเน€เธ เธ—">
+            <input type="text" class="form-control" name="id" id="id" placeholder="เธฃเธซเธฑเธชเธ‚เธญเธ‡เธ›เธฃเธฐเน€เธ เธ—" required>
           </div>
           <div class="form-group">
             <label for="description">เธฃเธฒเธขเธฅเธฐเน€เธญเธตเธขเธ”</label>
-            <input type="text" class="form-control" name="description" id="description" placeholder="เธฃเธฒเธขเธฅเธฐเน€เธญเธตเธขเธ”">
+            <input type="text" class="form-control" name="description" id="description" placeholder="เธฃเธฒเธขเธฅเธฐเน€เธญเธตเธขเธ”" required>
           </div>
           <div class="form-group">
             <label for="capacity_min">เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธ•เนˆเธณเธชเธธเธ”</label>
-            <input type="number" class="form-control" name="capacity_min" id="capacity_min" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธ•เนˆเธณเธชเธธเธ”" min="1">
+            <input type="number" class="form-control" name="capacity_min" id="capacity_min" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธ•เนˆเธณเธชเธธเธ”" min="1" required>
           </div>
           <div class="form-group">
             <label for="capacity_max">เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธชเธนเธ‡เธชเธธเธ”</label>
-            <input type="number" class="form-control" name="capacity_max" id="capacity_max" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธชเธนเธ‡เธชเธธเธ”" min="1">
+            <input type="number" class="form-control" name="capacity_max" id="capacity_max" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธชเธนเธ‡เธชเธธเธ”" min="1" required>
           </div>
           <button type="submit" class="my-2 btn btn-success">เน€เธžเธดเนˆเธก</button>
         </form>
diff --git a/views/restaurant/tabletype/manage.ejs b/views/restaurant/tabletype/manage.ejs
index 6ca982f7fe1ef8902c03497bafd4f52bed08472c..878f8ab9c8d61ef49037666924758e604b15472b 100644
--- a/views/restaurant/tabletype/manage.ejs
+++ b/views/restaurant/tabletype/manage.ejs
@@ -32,19 +32,19 @@
           <input type="hidden" name="tid" value="<%= tableTypeData.id %>">
           <div class="form-group">
             <label for="id">เธฃเธซเธฑเธชเธ‚เธญเธ‡เธ›เธฃเธฐเน€เธ เธ—</label>
-            <input type="text" class="form-control" name="id" id="id" placeholder="เธฃเธซเธฑเธชเธ‚เธญเธ‡เธ›เธฃเธฐเน€เธ เธ—" value="<%= tableTypeData.id %>">
+            <input type="text" class="form-control" name="id" id="id" placeholder="เธฃเธซเธฑเธชเธ‚เธญเธ‡เธ›เธฃเธฐเน€เธ เธ—" value="<%= tableTypeData.id %>" required>
           </div>
           <div class="form-group">
             <label for="description">เธฃเธฒเธขเธฅเธฐเน€เธญเธตเธขเธ”</label>
-            <input type="text" class="form-control" name="description" id="description" placeholder="เธฃเธฒเธขเธฅเธฐเน€เธญเธตเธขเธ”" value="<%= tableTypeData.description %>">
+            <input type="text" class="form-control" name="description" id="description" placeholder="เธฃเธฒเธขเธฅเธฐเน€เธญเธตเธขเธ”" value="<%= tableTypeData.description %>" required>
           </div>
           <div class="form-group">
             <label for="capacity_min">เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธ•เนˆเธณเธชเธธเธ”</label>
-            <input type="number" class="form-control" name="capacity_min" id="capacity_min" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธ•เนˆเธณเธชเธธเธ”" value="<%= tableTypeData.capacity_min %>" min="1">
+            <input type="number" class="form-control" name="capacity_min" id="capacity_min" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธ•เนˆเธณเธชเธธเธ”" value="<%= tableTypeData.capacity_min %>" min="1" required>
           </div>
           <div class="form-group">
             <label for="capacity_max">เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธชเธนเธ‡เธชเธธเธ”</label>
-            <input type="number" class="form-control" name="capacity_max" id="capacity_max" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธชเธนเธ‡เธชเธธเธ”" value="<%= tableTypeData.capacity_max %>" min="1">
+            <input type="number" class="form-control" name="capacity_max" id="capacity_max" placeholder="เธˆเธณเธ™เธงเธ™เธ—เธตเนˆเธ™เธฑเนˆเธ‡เธชเธนเธ‡เธชเธธเธ”" value="<%= tableTypeData.capacity_max %>" min="1" required>
           </div>
           <button type="submit" class="my-2 btn btn-success">เธšเธฑเธ™เธ—เธถเธ</button>
         </form>