added user, kurir and admin page, complete the process of kurir

.gitignore

@@ -58,6 +58,7 @@ build/Release
 
 node_modules/
 jspm_packages/
+tokens/
 
 # Snowpack dependency directory (https://snowpack.dev/)
 

assets/admin.js

@@ -0,0 +1,79 @@
+const socket = io(socket_server); // Connects to your server
+
+function reloadTheTable() {
+    if (document.getElementById('tb-paket')) {
+        // If tb-paket is a DataTable instance
+        $('#tb-paket').DataTable().destroy();
+        reloadTable();
+    }
+}
+
+
+socket.on('connect', () => {
+    console.log('Connected to server:', socket.id);
+});
+
+
+
+// notifikasi pengiriman baru oleh user
+socket.on('pengiriman_baru_client', (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => {});
+    toastr.info("Ada Pengiriman Baru");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+
+    // console.log(data);
+});
+
+// notifikasi pembatalan paket dilakukan oleh kurir
+socket.on('pembatalan_paket_kurir', (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => {});
+    toastr.warning("Kurir Membatalkan Pengambilan Paket No Resi <b>" + data._id + "</b>\nAlasan: <b>" + data.alasan + "</b>\nAdmin dapat menugaskan Kurir Baru atau Membatalkan Pengiriman.");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+
+// notifikasi kurir dalam perjalanan mengambil paket
+socket.on('kurir_mengambil_pengiriman_admin', (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => {});
+    toastr.info("Kurir Menyetujui Pengambilan Paket No Resi <b>" + data._id + "</b> dan Dalam Perjalanan Mengambil Paket di Alamat Pengirim : <b>" + data.alamat_pengirim + "</b>");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+
+
+// notifikasi kurir mengambil paket dari pengirim dan mengantarkan ke penerima
+socket.on('kurir_menghantar_ke_penerima_admin', (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => {});
+    // console.log(data);
+    if(data.status == 'Mengirim Paket Ke Alamat Penerima') {
+        toastr.info("Kurir Telah Mengambil Paket No Resi <b>" + data._id + "</b> dari Pengirim dan Dalam Perjalanan Mengantarkan ke Penerima di Alamat Penerima : <b>" + data.alamat_penerima + "</b>");
+    }else {
+        toastr.success("Kurir Telah Mengantarkan Paket No Resi <b>" + data._id + "</b> ke Penerima di Alamat Penerima : <b>" + data.alamat_penerima + "</b>");
+    }
+    
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+
+// notifikasi verifikasi paket diterima oleh user
+socket.on('diterima_terverifikasi_admin', (data) => {
+    console.log(data);
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => {});
+    toastr.success("Paket No Resi <b>" + data._id + "</b> Telah Diterima dan diverifikasi oleh Pengirim");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+
+
+// tiada notifikasi sebab pengirim yang membatalkan pengiriman
+socket.on('delete_kiriman_admin', (data) => {
+    console.log(data);
+
+    reloadTheTable();
+});

assets/kurir.js

@@ -0,0 +1,40 @@
+const url = new URL(window.location.href); // or use your URL string instead
+const pathSegments = url.pathname.split('/').filter(Boolean);
+
+// Check if 'kurir' is present and if there's something after it
+const index = pathSegments.indexOf('kurir');
+const hasParamAfterKurir = index !== -1 && index < pathSegments.length - 1;
+
+console.log(hasParamAfterKurir); // true or false
+
+const socket = io(socket_server); // Connects to your server
+
+
+socket.on('connect', () => {
+    console.log('Connected to server:', socket.id);
+});
+
+function reloadTheTable() {
+    if (document.getElementById('tb-paket')) {
+        // If tb-paket is a DataTable instance
+        $('#tb-paket').DataTable().destroy();
+        reloadTable();
+    }
+}
+console.log(global_data._id);
+socket.on('kurir_ditugaskan_' + global_data._id, (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => {});
+    toastr.info("Ada Pengiriman Baru Ditugaskan Untuk Anda");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+
+    // console.log(data);
+});
+
+document.getElementById('h5-title').innerHTML = global_data.nama;
+
+$("#img-avatar").attr("src", hasParamAfterKurir? 'kurir/' + global_data.gambar_kurir : 'kurir/kurir/' + global_data.gambar_kurir);
+$("#img-avatar").css("width", "65px");
+$("#img-avatar").css("height", "65px");
+

assets/my-js.js

@@ -1,11 +1,20 @@
+let socket_server;
+
+if (window.location.hostname === "20.20.20.26" && window.location.port === "3011") {
+    socket_server = "http://20.20.20.26:3014";
+} else {
+    socket_server = "https://socket-shenior.mywork-kkk.online";
+}
+
+console.log("Socket server:", socket_server);
 function logout() {
     return swal({
         title: "Yakin?",
         text: "Anda akan keluar dari sistem",
-        type: "warning", 
+        type: "warning",
         showCancelButton: !0,
-        confirmButtonColor: "#DD6B55", 
-        confirmButtonText: "Ya, logout!", 
+        confirmButtonColor: "#DD6B55",
+        confirmButtonText: "Ya, logout!",
         cancelButtonText: "Tidak, batal!",
         closeOnConfirm: !1,
         closeOnCancel: !1,
@@ -16,7 +25,7 @@ function logout() {
             localStorage.removeItem('user');
             localStorage.removeItem('role');
             window.location.href = "/"
-        }else{
+        } else {
             // close swal
             swal.close()
         }
@@ -75,7 +84,31 @@ function enableInput(stat) {
 
 }
 
+
+
 function numberOnly(element) { //only number and remove comma
     element.value = element.value.replace(/[^0-9]/g, '');
     element.value = element.value.replace(/,/g, '');
-}
+}
+
+function formatToMakassar(dateString) {
+  const dateObj = new Date(dateString);
+
+  const options = {
+    timeZone: 'Asia/Makassar',
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    hour: '2-digit',
+    minute: '2-digit',
+    second: '2-digit',
+    hour12: false,
+  };
+
+  const parts = new Intl.DateTimeFormat('id-ID', options).formatToParts(dateObj);
+
+  const getPart = (type) => parts.find(p => p.type === type)?.value ?? '';
+
+  // Format: DD-MM-YYYY, HH.mm.ss
+  return `${getPart('day')}-${getPart('month')}-${getPart('year')}, ${getPart('hour')}.${getPart('minute')}.${getPart('second')}`;
+}

assets/user.js

@@ -0,0 +1,76 @@
+const socket = io(socket_server); // Connects to your server
+
+
+socket.on('connect', () => {
+    console.log('Connected to server:', socket.id);
+});
+
+function reloadTheTable() {
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    if (document.getElementById('tb-paket')) {
+        // If tb-paket is a DataTable instance
+        $('#tb-paket').DataTable().destroy();
+        reloadTable();
+    }
+}
+
+
+// notifikasi pembatalan paket oleh kurir
+socket.on('pembatalan_paket_' + global_data._id, (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => { });
+    toastr.warning(`Pembatalan Pengiriman Paket<br>Status: <b>${data.status}</b>`);
+    console.log(data);
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+
+    // console.log(data);
+});
+
+
+// notifikasi kurir ditugaskan oleh admin
+socket.on('kurir_ditugaskan_' + global_data._id, (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => { });
+    toastr.info(`Kurir Telah Ditugaskan Untuk Pengiriman Paket<br>No Resi: <b>${data._id}</b>\nSila Liat Detail Pengiriman Untuk Informasi Lebih Lanjut`);
+    console.log(data);
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+
+    // console.log(data);
+});
+
+
+// notifikasi pembatalan paket yang dilakukan oleh kurir
+socket.on('pembatalan_paket_kurir_' + global_data._id, (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => { });
+    toastr.warning("Kurir Membatalkan Pengambilan Paket No Resi <b>" + data._id + "</b>\nAdmin akan menugaskan Kurir Baru.\nMohon Maaf dan Harap Tunggu.");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+
+
+// notifikasi kurir dalam perjalanan mengambil paket
+socket.on('kurir_mengambil_pengiriman_' + global_data._id, (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => { });
+    toastr.info("Kurir Dalam Perjalanan Mengambil Paket No Resi <b>" + data._id + "</b>\nDiharap Pengirim Menunggu Kurir Sampai");
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+
+// notifikasi kurir mengambil paket dari pengirim dan mengantarkan ke penerima
+socket.on('kurir_menghantar_ke_penerima_' + global_data._id, (data) => {
+    const sound = new Audio('/sound/notif.mp3');
+    sound.play().catch(() => { });
+    // console.log(data)
+    if (data.status == 'Mengirim Paket Ke Alamat Penerima') {
+        toastr.info("Kurir Telah Mengambil Paket No Resi <b>" + data._id + "</b> dari Pengirim dan Dalam Perjalanan Mengantarkan ke Penerima di Alamat Penerima : <b>" + data.alamat_penerima + "</b>");
+    }else {
+        toastr.success("Kurir Telah Mengantarkan Paket No Resi <b>" + data._id + "</b> ke Penerima di Alamat Penerima : <b>" + data.alamat_penerima + "</b>");
+    }
+    // check if tb-paket is available , if available destroy then  reloadTable()
+    reloadTheTable();
+});
+

bot.ts

@@ -1,8 +1,16 @@
 import { create, Whatsapp } from 'venom-bot';
 import express, { type Request, type Response } from 'express';
+import type { UploadedFile } from 'express-fileupload';
 
 let client: Whatsapp;
 
+function convertToPhoneNumber(number: string): number {
+  if (number.startsWith('0')) {
+    number = number.slice(1);
+  }
+  return parseInt(`62${number}`);
+}
+
 async function initBot() {
   try {
     client = await create({
@@ -32,15 +40,8 @@ function startServer() {
 
   app.post('/send-otp', async (req: Request, res: Response) => {
     let { number, otp } = req.body;
-    
-    // remove the 0 in front of the number
-    if (number.startsWith('0')) {
-      number = number.slice(1);
-    }
-    // add +62 to the number
-    number = `+62${number}`;
-    // convert to int
-    number = parseInt(number);
+
+    number = convertToPhoneNumber(number);
     console.log(`Sending OTP ${otp} to ${number}`);
 
     const formattedNumber = `${number}@c.us`;
@@ -68,6 +69,28 @@ function startServer() {
     }
   });
 
+  app.post('/send-message', async (req: Request, res: Response) => {
+    let { number, message, img_stat = false , foto_paket , foto_name} = req.body;
+
+
+    console.log(number, message, img_stat);
+
+    number = convertToPhoneNumber(number);
+
+    const formattedNumber = `${number}@c.us`;
+    try {
+      if(img_stat){
+        await client.sendImage(formattedNumber, foto_paket, foto_name, message);
+      }else{
+        await client.sendText(formattedNumber, message);
+      }
+      res.status(200).json({ success: true });
+    } catch (error) {
+      console.error(error);
+      res.status(500).json({ error: 'Failed to send message.' });
+    }
+  });
+
   const PORT = 3012;
   app.listen(PORT, () => {
     console.log(`WhatsApp bot API listening on http://localhost:${PORT}`);

index.ts

@@ -1,16 +1,20 @@
 // ini adalah file utama dari aplikasi ini
 import express, { type Request, type Response } from 'express';
 
-import http from 'http';
 
-import * as socket from './socket';
-const socket_client = socket.clientSocket;
-
-
-// import formData from 'express-form-data';
+// import cors from 'cors';
 import fileUpload from 'express-fileupload';
 import  {testDatabaseConnection} from './connection';
 import path from 'path';
+
+import { io, Socket } from 'socket.io-client';
+
+
+
+
+
+const app = express();
+
 import adminRouter from './routes/admin_router';
 import userRouter from './routes/user_router';
 import kurirRouter from './routes/kurir_router';
@@ -21,13 +25,12 @@ import { config } from 'dotenv';
 config();
 console.log("diatas untuk dotenv");
 
+const socket_client: Socket = io(process.env.socket_server as string);
 
 
 
-const app = express();
 const port = process.env.PORT || 3011;
-const server = http.createServer(app);
-const io = socket.init(server);
+
 
 
 
@@ -43,6 +46,9 @@ app.use(fileUpload({
 app.use(express.json());
 app.use(express.urlencoded({ extended: true }));
 
+// app.options('*', cors())
+// app.use(cors())
+
 
 
 
@@ -53,48 +59,9 @@ app.use('/admin', adminRouter);
 app.use('/kurir', kurirRouter);
 app.use('/', userRouter);
 
-io.on('connection', (socket) => {
-    const userID = socket.id;
-    // console.log('A user connected: ' + userID);
+export { socket_client }
 
-    socket.on('scan_dia', (data: any) => {
-        console.log('Received scan_dia event: ' + data);
-        io.emit('scan_dia_lagi', "coba");
-        // socket.broadcast.emit('scan_dia_lagi', "coba");
-        // // cobadulu();
-        //  io.emit('scan_dia_lagi', 'ini coba');
-    });
-
-    socket.on('scan_dia_lagi', (data: any) => {
-        console.log('Received scan_dia_lagi event: ' + data);
-    });
-
-    socket.on('disconnect', () => {
-        // console.log('User disconnected: ' + userID);
-    });
+app.listen(port, async () => {
+    console.log(`Server is running on port ${port}`);
 });
 
-
-// function cobadulu(){
-//     console.log("coba");
-//     socket_client.emit('scan_dia_lagi', 'ini coba');
-// }
-
-
-
-// app.post('/submit', (req: Request, res: Response) => {
-//     console.log('Received form data:', req.body);
-//     res.json({ message: 'Form data received!', data: req.body });
-// });
-
-
-
-
-// app.listen(port, async () => {
-//     console.log(`Server is running on port ${port}`);
-// });
-server.listen(port, () => {
-    console.log(`Server running on port ${port}`);
-});
-
-export default { app, server, io };

index1.ts

@@ -1,43 +0,0 @@
-
-import express from 'express';
-import { createServer } from 'http';
-import { Server } from 'socket.io';
-import path from 'path';
-import { fileURLToPath } from 'url';
-
-const app = express();
-const server = createServer(app);
-const io = new Server(server, {
-  cors: {
-    origin: "*", // allow all for dev
-    methods: ["GET", "POST"]
-  }
-});
-
-// Serve static files
-const __filename = fileURLToPath(import.meta.url);
-const __dirname = path.dirname(__filename);
-app.use(express.static(path.join(__dirname, 'public')));
-
-io.on('connection', (socket) => {
-  console.log('✅ A user connected:', socket.id);
-
-  socket.on('scan_dia', (data: any) => {
-    console.log('📩 Received scan_dia:', data);
-    
-  });
-
-  socket.on('scan_dia_lagi', (data: any) => {
-    console.log('📩 Received scan_dia_lagi:', data);
-    // io.emit('scan_dia_lagi', "coba");
-  });
-
-  socket.on('disconnect', () => {
-    console.log('❌ User disconnected:', socket.id);
-  });
-});
-
-const PORT = 3011;
-server.listen(PORT, () => {
-  console.log(`🚀 Server running at http://localhost:${PORT}`);
-});

models/kiriman_model.ts

@@ -0,0 +1,40 @@
+import mongoose from "mongoose";
+
+const timelineItemSchema = new mongoose.Schema({
+  status: { type: String, required: true },
+  waktu: { type: Date, default: Date.now },
+  gambar: { type: String }, // optional image for this step
+  alasan: { type: String }, // optional text for this step
+  id_kurir: { type: String }
+}, { _id: false }); // _id: false to prevent auto _id in sub-docs
+
+const kirimanSchema = new mongoose.Schema({
+  id_pengirim: { type: String, required: true },
+  no_telpon_pengirim: { type: String, required: true },
+  nama_pengirim: { type: String, required: true },
+  alamat_pengirim: { type: String, required: true },
+
+  no_telpon_penerima: { type: String, required: true },
+  nama_penerima: { type: String, required: true },
+  alamat_penerima: { type: String, required: true },
+
+  gambar_paket: { type: String, required: true },
+  id_kurir: { type: String },
+
+  status: { type: String, default: 'Menunggu Admin Memproses' },
+
+  timeline: {
+    type: [timelineItemSchema],
+    default: () => ([{
+      status: 'Menunggu Admin Memproses',
+      waktu: new Date()
+    }])
+  }
+
+}, {
+  timestamps: true
+});
+
+const KirimanModel = mongoose.model('Kiriman_Collection', kirimanSchema);
+
+export default KirimanModel;

package.json

@@ -16,12 +16,13 @@
     "@types/express-fileupload": "^1.5.1",
     "@types/express-form-data": "^2.0.5",
     "axios": "^1.9.0",
+    "cors": "^2.8.5",
     "dotenv": "^16.4.7",
     "express": "^4.21.2",
     "express-fileupload": "^1.5.1",
     "express-form-data": "^2.0.23",
+    "form-data": "^4.0.3",
     "mongoose": "^8.12.1",
-    "socket.io": "^4.8.1",
     "socket.io-client": "^4.8.1",
     "venom-bot": "^5.3.0"
   }

public/index.html

@@ -1,27 +0,0 @@
-<!-- public/index.html -->
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8" />
-  <title>Receiver Page</title>
-</head>
-<body>
-  <h2>This is index.html (Receiver)</h2>
-
-  <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
-  <script>
-    const socket = io();
-
-    socket.on('connect', () => {
-      console.log('Connected to server:', socket.id);
-    });
-
-    socket.on('scan_dia_lagi', (data) => {
-      console.log('📨 Received scan_dia_lagi:', data);
-    });
-  </script>
-</body>
-</html>
-
-
-

public/index2.html

@@ -1,26 +0,0 @@
-<!-- public/index2.html -->
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8" />
-  <title>Emitter Page</title>
-</head>
-<body>
-  <h2>This is index2.html (Emitter)</h2>
-  <button onclick="emitScan()">Emit scan_dia_lagi</button>
-
-  <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
-  <script>
-    const socket = io();
-
-    socket.on('connect', () => {
-      console.log('Connected to server:', socket.id);
-    });
-
-    function emitScan() {
-      socket.emit('scan_dia_lagi', 'Hello from index2.html!');
-      console.log('📤 Emitted scan_dia_lagi');
-    }
-  </script>
-</body>
-</html>

routes/admin_router.ts

@@ -2,9 +2,13 @@
 import express from 'express';
 import type { Request, Response } from 'express';
 import type { UploadedFile } from 'express-fileupload';
+import KirimanModel from '../models/kiriman_model';
 import path from 'path';
 import fs from 'fs';
 import KurirModel from '../models/kurir_model';
+import UserModel from '../models/user_model';
+import axios from 'axios';
+import { socket_client } from '../index';
 
 
 const router = express.Router();
@@ -36,10 +40,10 @@ router.get('/kurir/gambar/:no_telpon/:jenis', (req: Request, res: Response) => {
             return
         }
         // Define file paths
-        const motorGambar = path.join(__dirname, '../images/'+ jenis +'/'+data.gambar_motor);
-        const kurirGambar = path.join(__dirname, '../images/kurir/'+data.gambar_kurir);
+        const motorGambar = path.join(__dirname, '../images/' + jenis + '/' + data.gambar_motor);
+        const kurirGambar = path.join(__dirname, '../images/kurir/' + data.gambar_kurir);
 
-        if(jenis == 'motor') {
+        if (jenis == 'motor') {
             res.sendFile(motorGambar);
         } else {
             res.sendFile(kurirGambar);
@@ -106,7 +110,7 @@ router.post('/kurir', async (req: Request, res: Response) => {
         // Save to MongoDB
         const newKurir = new KurirModel({
             no_telpon,
-            password : no_telpon,           
+            password: no_telpon,
             nama,
             jenis_kelamin,
             dd_motor,
@@ -126,6 +130,173 @@ router.post('/kurir', async (req: Request, res: Response) => {
     }
 });
 
+router.get('/check-kurir/tersedia', (req: Request, res: Response) => {
+    try {
+        // search by status = "Tersedia" || null || undefined
+        KurirModel.find({ status: { $in: ['Tersedia', null, undefined] } }).then((data) => {
+            res.json(data);
+        });
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+})
+
+router.get('/paket-baru', async (req: Request, res: Response) => {
+    try {
+        // search by status != "Dibatalkan Oleh Admin"
+        const response = await KirimanModel.find({
+            status: {
+                $nin: ['Dibatalkan Oleh Admin','Paket Telah Diterima Penerima','Diterima Terverifikasi', "Dibatalkan Oleh Pengirim"],
+                $type: 'string'
+            }
+        });
+        // console.log(response);
+        res.status(200).json(response);
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+})
+
+router.get('/paket-all', async (req: Request, res: Response) => {
+    try {
+        // search by status != "Dibatalkan Oleh Admin"
+        const response = await KirimanModel.find();
+        // console.log(response);
+        res.status(200).json(response);
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+})
+
+
+router.delete('/batalkan-pengiriman/', async (req: Request, res: Response) => {
+    try {
+        // const { id } = req.params;
+        const { alasan, id } = req.body; // optional reason from admin (e.g., from SweetAlert input)
+        // console.log(id, alasan);
+
+        const updatedDoc = await KirimanModel.findByIdAndUpdate(
+            id,
+            {
+                $set: {
+                    status: 'Dibatalkan Oleh Admin'
+                },
+                $push: {
+                    timeline: {
+                        status: 'Dibatalkan Oleh Admin',
+                        waktu: new Date(),
+                        alasan: alasan || null
+                    }
+                }
+            },
+            { new: true } // Return the updated document
+        );
+        // console.log(updatedDoc);
+        const userData = await UserModel.findById(updatedDoc?.id_pengirim);
+
+        // console.log(userData)
+        socket_client.emit('pembatalan_paket', updatedDoc);
+
+        try {
+            await axios.post('http://localhost:3012/send-message', { number: userData?.no_telpon, message: `🛵*_Kurir Shenior 🛵_*\nPengiriman anda dengan nomor resi ${updatedDoc?._id} telah dibatalkan oleh admin\nAlasan: *${alasan || 'Belum ada alasan'}* ❌❌` });
+        } catch (err) {
+            console.log(err);
+        }
+
+
+        res.status(200).json("response");
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+});
+
+router.post('/tugaskan-kurir', async (req: Request, res: Response) => {
+    const { id_kiriman, id_kurir } = req.body;
+    console.log(id_kiriman, id_kurir);
+    try {
+        const updatedDoc = await KirimanModel.findByIdAndUpdate(
+            id_kiriman,
+            {
+                $set: {
+                    status: 'Kurir Telah Ditugaskan',
+                    id_kurir: id_kurir
+                },
+                $push: {
+                    timeline: {
+                        status: 'Kurir Telah Ditugaskan',
+                        waktu: new Date(),
+                        // alasan: alasan || null
+                    }
+                }
+            },
+            { new: true } // Return the updated document
+        );
+
+        await KurirModel.findByIdAndUpdate(
+            id_kurir,
+            {
+                $set: {
+                    status: 'Ditugaskan'
+                }
+            },
+            { new: true } // Return the updated document
+        );
+
+        console.log(updatedDoc);
+
+        socket_client.emit('tugaskan_kurir_server', updatedDoc);
+
+        try {
+            const userData = await UserModel.findById(updatedDoc?.id_pengirim);
+            const kurirData = await KurirModel.findById(id_kurir);
+            await axios.post('http://localhost:3012/send-message', { number: userData?.no_telpon, message: `🛵 * _Kurir Shenior 🛵_*\nPengiriman anda dengan nomor resi ${updatedDoc?._id} \nStatus : *Kurir Telah DItugaskan*✅✅` });
+            await axios.post('http://localhost:3012/send-message', { number: kurirData?.no_telpon, message: `🛵 *_Kurir Shenior 🛵_*\nAnda telah ditugaskan untuk mengirim paket\nNomor Resi : *${updatedDoc?._id}*\nAlamat Paket : _*${updatedDoc?.alamat_pengirim}* _\nSila buka situs Kurir Shenior dan login untuk detail lebih lanjut ✅✅` });
+        } catch (err) { console.log(err) }
+
+        res.status(200).json(updatedDoc);
+
+    } catch (err) {
+        console.log(err);
+        res.status(500).json([]);
+    }
+});
+
+
+// ini untuk user
+router.get('/user', (req: Request, res: Response) => {
+    res.sendFile(__dirname + '/admin_ui/user.html');
+});
+
+router.get('/user/data', async (req: Request, res: Response) => {
+    try {
+        const data = await UserModel.find();
+        res.json(data);
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+});
+
+router.get('/user/data/:id', async (req: Request, res: Response) => {
+    const { id } = req.params;
+    console.log(id, "ini id");
+    try {
+        const data = await UserModel.findById(id);
+        res.json(data);
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+});
+
+// ini untuk list penghantaran
+router.get('/list', (req: Request, res: Response) => {
+    res.sendFile(__dirname + '/admin_ui/list.html');
+});
 
 
 router.get('/login', (req: Request, res: Response) => {

routes/admin_ui/kurir.html

@@ -64,13 +64,13 @@
                     </li>
 
                     <li>
-                        <a class="waves-effect" href="#" onclick="notAvailable()"><i
-                                class="menu-icon fa fa-users"></i><span>List User</span></a>
+                        <a class="waves-effect" href="/admin/user"><i class="menu-icon fa fa-users"></i><span>List
+                                User</span></a>
                     </li>
 
                     <li>
-                        <a class="waves-effect" href="#" onclick="notAvailable()"><i
-                                class="menu-icon ico icon-table"></i><span>List Penghantaran</span></a>
+                        <a class="waves-effect" href="/admin/list"><i class="menu-icon ico icon-table"></i><span>List
+                                Penghantaran</span></a>
                     </li>
 
 

routes/admin_ui/list.html

@@ -0,0 +1,895 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+	<meta name="description" content="">
+	<meta name="author" content="">
+
+	<title>Shenior Kurir | List Penghantaran</title>
+
+	<!-- Main Styles -->
+	<link rel="stylesheet" href="/styles/style.min.css">
+
+	<!-- mCustomScrollbar -->
+	<link rel="stylesheet" href="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
+
+	<!-- Waves Effect -->
+	<link rel="stylesheet" href="/plugin/waves/waves.min.css">
+
+	<!-- Sweet Alert -->
+	<link rel="stylesheet" href="/plugin/sweet-alert/sweetalert.css">
+
+	<link rel="stylesheet" href="/fonts/fontello/fontello.css">
+
+	<link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
+	<link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
+
+	<link rel="stylesheet" href="/plugin/datatables/media/css/dataTables.bootstrap.min.css">
+
+	<!-- Toastr -->
+	<link rel="stylesheet" href="/plugin/toastr/toastr.css">
+
+	<!-- Select2 -->
+	<link rel="stylesheet" href="/plugin/select2/css/select2.min.css">
+
+	<!-- Timeline -->
+	<!-- <link rel="stylesheet" href="/plugin/timeline/css/style.css"> -->
+
+</head>
+
+<body>
+	<div class="main-menu">
+		<header class="header">
+			<a href="/admin" class="logo">Shenior Kurir</a>
+			<button type="button" class="button-close fa fa-times js__menu_close"></button>
+			<div class="user">
+				<a href="#" class="avatar"><img src="/images/admin.png" alt=""><span class="status online"></span></a>
+				<h5 class="name"><a href="#">Admin</a></h5>
+				<h5 class="position">Admin</h5>
+
+			</div>
+			<!-- /.user -->
+		</header>
+		<!-- /.header -->
+		<div class="content">
+
+			<div class="navigation">
+				<h5 class="title">Navigasi</h5>
+				<!-- /.title -->
+				<ul class="menu js__accordion">
+					<li >
+						<a class="waves-effect" href="/admin"><i class="menu-icon fa fa-home"></i><span>Halaman
+								Utama</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/admin/kurir"><i
+								class="menu-icon ico mdi mdi-motorbike"></i><span>List Kurir</span></a>
+					</li>
+
+					<li>
+                        <a class="waves-effect" href="/admin/user"><i class="menu-icon fa fa-users"></i><span>List
+                                User</span></a>
+                    </li>
+
+					<li lass="current active">
+						<a class="waves-effect" href="/admin/list" ><i
+								class="menu-icon ico icon-table"></i><span>List Penghantaran</span></a>
+					</li>
+
+
+					<li class="current active">
+						<a class="waves-effect" href="#" onclick="logout()"><i
+								class="menu-icon ico icon-logout"></i><span>Logout</span></a>
+					</li>
+				</ul>
+
+			</div>
+			<!-- /.navigation -->
+		</div>
+		<!-- /.content -->
+	</div>
+	<!-- /.main-menu -->
+
+	<div class="fixed-navbar">
+		<div class="pull-left">
+			<button type="button"
+				class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
+			<h1 class="page-title">List Penghantaran</h1>
+			<!-- /.page-title -->
+		</div>
+		<!-- /.pull-left -->
+		<div class="pull-right">
+
+
+			<a href="#" class="ico-item ico icon-logout" onclick="logout()"></a>
+		</div>
+		<!-- /.pull-right -->
+	</div>
+	<!-- /.fixed-navbar -->
+
+	<div id="wrapper">
+		<div class="main-content">
+			<div class="row">
+				
+				<div class="col-xs-12">
+					<div class="box-content card">
+						<h4 class="box-title">Form List Penghantaran</h4>
+						<!-- /.box-title -->
+						<div class="card-content">
+							<div class="form-group text-center" id="text-tiada-pengiriman">
+								<p>Tidak ada list penghantaran</p>
+							</div>
+							<div class="form-group" id="form-tb-paket">
+								<table id="tb-paket" class="table table-striped table-bordered display"
+									style="width:100%">
+
+								</table>
+							</div>
+						</div>
+					</div>
+					<!-- /.box-content -->
+				</div>
+			</div>
+			<footer class="footer">
+				<ul class="list-inline">
+					<li>Arifuddin Naawi Amanah © 2025.</li>
+					<!-- <li><a href="#">Privacy</a></li>
+				<li><a href="#">Terms</a></li>
+				<li><a href="#">Help</a></li> -->
+				</ul>
+			</footer>
+		</div>
+		<!-- /.main-content -->
+	</div><!--/#wrapper -->
+
+	<div class="modal fade" id="modal-paket" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-paket-title">Modal title</h4>
+				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-paket" style="display: none">
+							<center>
+								<div id="preview-gambar-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-paket">
+						<!-- create upload -->
+						<label for="modal-paket-nama">Photo Paket</label>
+						<input type="file" class="form-control" id="gambar-paket" accept="image/*"
+							onchange="showUpload(this, 'gambar-paket')">
+					</div>
+
+					<div class="form-group" id="div-nomor-resi" style="display: none">
+						<label for="modal-paket-nomor-resi">Nomor Resi</label>
+						<input type="text" class="form-control" id="nomor_resi">
+					</div>
+
+					<div class="form-group" id="div-waktu-dibuat" style="display: none">
+						<label for="modal-paket-waktu-dibuat">Waktu Dibuat</label>
+						<input type="text" class="form-control" id="waktu_dibuat">
+					</div>
+
+					<div class="form-group" id="div-status" style="display: none">
+						<label for="modal-paket-div-status">Status</label>
+						<input type="text" class="form-control" id="status">
+					</div>
+
+					<hr>
+					<hr>
+
+
+					<div class="form-group">
+						<label for="modal-paket-nama-pengirim">Nama Pengirim</label>
+						<input type="text" class="form-control" id="nama_pengirim" placeholder="Masukkan Nama Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-pengirim">No Telpon/HP Pengirim</label>
+						<input type="text" class="form-control" id="no_telpon_pengirim" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-pengirim">Alamat Pengirim</label>
+						<textarea name="alamat_pengirim" class="form-control" id="alamat_pengirim"
+							placeholder="Masukkan Alamat Pengirim" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-nama-penerima">Nama Penerima</label>
+						<input type="text" class="form-control" id="nama_penerima" placeholder="Masukkan Nama Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-penerima">No Telpon/HP Penerima</label>
+						<input type="text" class="form-control" id="no_telpon_penerima" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-penerima">Alamat Penerima</label>
+						<textarea name="alamat_penerima" class="form-control" id="alamat_penerima"
+							placeholder="Masukkan Alamat Penerima" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group" id="div-data-kurir">
+						<label id="label-kurir-ditugaskan">Tugaskan Kurir</label>
+						<div id="div-select-kurir">
+							<select class="form-control" id="select-kurir" width="100%"></select>
+						</div>
+						<input type="text" class="form-control" id="input_kurir" style="display: none">
+					</div>
+
+					<hr>
+					<hr>
+
+
+					<div class="form-group">
+						<label for="modal-paket-berat">Progress</label>
+						<div class="activity-list">
+						</div>
+					</div>
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-xs btn-default btn-sm waves-effect waves-light"
+						data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-xs btn-danger btn-sm waves-effect waves-light"
+						id="btn-batalkan-paket">Batalkan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-primary btn-sm waves-effect waves-light"
+						id="btn-tugaskan-kurir">Tugaskan Kurir</button>
+
+				</div>
+			</div>
+		</div>
+	</div>
+
+	<div class="modal fade" id="modal-kurir" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-kurir-title">Modal title</h4>
+				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-kurir" style="display: none">
+							<center>
+								<div id="preview-gambar-kurir" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-kurir">
+						<!-- create upload -->
+						<label for="modal-kurir-nama">Photo Kurir</label>
+						<input type="file" class="form-control" id="gambar-kurir" accept="image/*"
+							onchange="showUpload(this, 'gambar-kurir')">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-kurir-nama">Nama</label>
+						<input type="text" class="form-control" id="nama-kurir" placeholder="Masukkan Nama">
+					</div>
+					<div class="form-group">
+						<label for="modal-kurir-nama">No Telpon/HP</label>
+						<input type="text" class="form-control" id="no_telpon-kurir" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-kurir-nama">Jenis Kelamin</label>
+						<select class="form-control" id="jenis-kelamin-kurir">
+							<option value="" disabled selected>-Pilih Jenis Kelamin</option>
+							<option value="Laki-laki">Laki-laki</option>
+							<option value="Perempuan">Perempuan</option>
+						</select>
+					</div>
+					<hr>
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-motor" style="display: none">
+							<center>
+								<div id="preview-gambar-motor" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-motor">
+						<!-- create upload -->
+						<label for="modal-kurir-nama">Photo Motor</label>
+						<input type="file" class="form-control" id="gambar-motor" accept="image/*"
+							onchange="showUpload(this, 'gambar-motor')">
+					</div>
+					<div class="form-group">
+						<label for="modal-kurir-dd-motor">DD Motor</label>
+						<input type="text" class="form-control" id="dd-motor-kurir" placeholder="Masukkan DD Motor">
+					</div>
+
+
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default btn-sm waves-effect waves-light"
+						id="button-close-modal-kurir">Close</button>
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+	<!--[if lt IE 9]>
+		<script src="/script/html5shiv.min.js"></script>
+		<script src="/script/respond.min.js"></script>
+	<![endif]-->
+	<!-- 
+	================================================== -->
+	<!-- Placed at the end of the document so the pages load faster -->
+	<script src="/scripts/jquery.min.js"></script>
+	<script src="/scripts/modernizr.min.js"></script>
+	<script src="/plugin/bootstrap/js/bootstrap.min.js"></script>
+	<script src="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+	<script src="/plugin/nprogress/nprogress.js"></script>
+	<script src="/plugin/sweet-alert/sweetalert.min.js"></script>
+	<script src="/plugin/waves/waves.min.js"></script>
+	<!-- Full Screen Plugin -->
+	<script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
+
+	<!-- Toastr -->
+	<script src="/plugin/toastr/toastr.min.js"></script>
+
+	<script src="/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
+	<script src="/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
+	<script src="/plugin/datatables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
+
+	<!-- <script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script> -->
+
+	<!-- Select2 -->
+	<script src="/plugin/select2/js/select2.min.js"></script>
+
+	<script src="/block/jquery.blockUI.js"></script>
+
+	<script src="/scripts/main.min.js"></script>
+	<script src="/my-js.js"></script>
+	<script src="/socket-io/client-dist/socket.io.js"></script>
+	<script src="/admin.js"></script>
+
+	<script>
+
+		function select_function() {
+			$('#select-kurir').select2({
+				placeholder: '-Sila Pilih Kurir-',
+				width: '100%',
+				ajax: {
+					url: '/admin/check-kurir/tersedia',
+					type: 'GET',
+					dataType: 'json',
+					delay: 250,
+					processResults: function (data) {
+						// make sure `data` is an array
+						return {
+							results: data.map(kurir => ({
+								id: kurir._id + "-" + kurir.nama + "-" + kurir.no_telpon,
+								text: kurir.nama
+							}))
+						};
+					},
+					cache: true
+				}
+			});
+		}
+
+		// select_function();
+
+
+		function reloadTable() {
+			// destroy table
+			// $('#tb-kurir').DataTable().destroy();
+			$('#tb-paket').DataTable({
+				// responsive: true,
+				scrollX: true,
+				// order: [
+				// 	[0, 'asc']
+				// ],
+				ajax: {
+					url: '/admin/paket-all/',
+					type: 'GET',
+					timeout: 120000,
+					dataSrc: function (data) {
+						// console.log(data)
+						if (data.length == 0) {
+							$("#form-tb-paket").hide();
+							$("#text-tiada-pengiriman").show();
+						} else {
+							$("#form-tb-paket").show();
+							$("#text-tiada-pengiriman").hide();
+						}
+						return data.reverse();
+					}
+				},
+				"sAjaxDataProp": "",
+				"aoColumns": [
+					// {
+					// 	"mData": "_id",
+					// 	"title": "No Resi",
+					// 	"render": function (data, type, row) {
+					// 		return data
+					// 	}
+					// },
+					{
+						"mData": "nama_pengirim",
+						"title": "Nama Pengirim",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "nama_penerima",
+						"title": "Nama Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "alamat_penerima",
+						"title": "Alamat Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "status",
+						"title": "Status",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": null,
+						"title": "Aksi",
+						"render": function (data, type, row) {
+							return `<button type='button' onclick='open_modal_paket("${data._id}")' title='Detail Pengiriman' class='btn btn-info btn-circle btn-sm waves-effect waves-light'><i class='ico zmdi zmdi-info'></i></button> `
+						}
+					}
+				]
+
+			})
+
+
+		}
+
+		reloadTable()
+
+		async function open_modal_paket(id) {
+
+			
+			$.ajax({
+				url: '/user/paket-detail/' + id,
+				type: 'GET',
+				timeout: 20000,
+				beforeSend: function () {
+					select_function();
+					blockUI('Loading Data...');
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+				success: function (data) {
+					// Handle the response here
+					console.log(data.timeline);
+
+					if (data.id_kurir != null && data.id_kurir != undefined && data.id_kurir != "") {
+						// hide select kurir
+						$("#div-select-kurir").hide();
+						// show input_kurir
+						$("#input_kurir").show();
+
+						// hide batal button
+						$("#btn-batalkan-paket").hide();
+
+						// hide btn-tugaskan-kurir
+						$("#btn-tugaskan-kurir").hide();
+					} else {
+						// show select kurir
+						$("#div-select-kurir").show();
+						// hide input_kurir
+						$("#input_kurir").hide();
+						// show batal button
+						$("#btn-batalkan-paket").show();
+
+						// show btn-tugaskan-kurir
+						$("#btn-tugaskan-kurir").show();
+					}
+
+					// let waktu_dibuat = new Date(data.createdAt);
+
+					$('#modal-paket-title').html('Form Detail Pengiriman Paket');
+
+					// $("#id").val(data._id);
+					$("#div-nomor-resi").show();
+					$("#nomor_resi").val(data._id);
+					$("#div-waktu-dibuat").show();
+					$("#waktu_dibuat").val(formatToMakassar(data.createdAt));
+					$("#div-status").show();
+					$("#status").val(data.status);
+					$("#no_telpon_pengirim").val(data.no_telpon_pengirim);
+					$("#nama_pengirim").val(data.nama_pengirim);
+					$("#alamat_pengirim").val(data.alamat_pengirim);
+					$("#no_telpon_penerima").val(data.no_telpon_penerima);
+					$("#nama_penerima").val(data.nama_penerima);
+					$("#alamat_penerima").val(data.alamat_penerima);
+					// $("#gambar-paket").attr("src", data.gambar_paket);
+
+					var img = document.createElement('img');
+					img.src = "/user/paket-detail/" + data._id + "/" + data.gambar_paket;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
+
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					// disable all input in #form-modal
+					$("#form-gambar-paket").hide();
+
+					$('#form-modal :input').prop('disabled', true);
+
+					// make select enabled
+					$("#select-kurir").prop('disabled', false);
+
+
+					let activity_html = '';
+					for (let i = data.timeline.length - 1; i >= 0; i--) {
+						let colornya = 'bg-info';
+
+						if (data.timeline[i].status == 'Paket Telah Diterima Penerima') {
+							colornya = 'bg-success';
+						}
+
+						if (data.timeline[i].status.includes('Dibatalkan')) {
+							colornya = 'bg-danger';
+						}
+
+						activity_html += `<div class="activity-item">
+							<div class="bar ${colornya}">
+							<div class="dot ${colornya}"></div>
+							</div>
+							<div class="content">
+							<div class="date">${formatToMakassar(data.timeline[i].waktu)}</div>
+							<div class="text">
+								${data.timeline[i].status}
+								${!data.timeline[i].gambar ? "" : `<br><img src="/kurir/gambar-paket/${data._id}/${data.timeline[i].gambar}" width="100px" height="100px">`} 
+							</div>
+							</div>
+						</div>`;
+					}
+
+					$('.activity-list').html(activity_html);
+
+					// sign a onclick on #btn-batalkan-paket
+					$('#btn-batalkan-paket').attr('onclick', `batalkan_pengiriman('${data._id}')`);
+
+					// sign a onclick on #btn-tugaskan-kurir
+					$('#btn-tugaskan-kurir').attr('onclick', `tugaskan_kurir('${data._id}')`);
+
+
+					// data kurir
+					if (data.nama_kurir) {
+						$("#input_kurir").val(data.nama_kurir);
+						$("#label-kurir-ditugaskan").html(`Kurir Yang Ditugaskan <i
+									style="text-decoration: underline;color: blue">(Klik Untuk Melihat Info
+									Kurir)</i> `);
+						$("#div-data-kurir").attr("onclick", `liat_info_kurir('${data.no_telpon_kurir}',false)`);
+
+					} else {
+						$("#label-kurir-ditugaskan").html("Tugaskan Kurir");
+						$("#div-data-kurir").attr("onclick", null);
+					}
+
+					$("#select-kurir").val("").trigger('change');
+
+					$('#modal-paket').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+				},
+				error: function (xhr, status, error) {
+					console.error('AJAX error:', error);
+				}
+			});
+		}
+
+		function batalkan_pengiriman(id) {
+			// Hide the modal first
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "",
+				text: "Silakan tulis alasan pembatalan:",
+				type: "input",
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				inputPlaceholder: "Contoh: Kurir tidak tersedia",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					$('#modal-paket').modal('show');
+					return false;
+				}
+				if (inputValue === "") {
+					swal("Oops!", "Alasan tidak boleh kosong!", "error");
+					// open the modal again
+					$('#modal-paket').modal('show');
+					return false;
+				}
+
+				// close the swal
+				swal.close();
+				console.log(inputValue);
+
+				$.ajax({
+					url: '/admin/batalkan-pengiriman',
+					type: 'DELETE',
+					data: {
+						id: id,
+						alasan: inputValue
+					},
+					beforeSend: function () {
+						blockUI("Melakukan Pembatalan Pengiriman...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						// $.unblockUI();
+						swal({
+							title: "Berhasil!",
+							text: "Pengiriman Berhasil Dibatalkan",
+							type: "success",
+							timer: 2000, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				});
+			});
+
+
+
+
+
+		}
+
+
+		async function tugaskan_kurir(id) {
+			// Hide the modal first
+			$('#modal-paket').modal('hide');
+
+			const kurir_data = $('#select-kurir').val();
+
+
+			if (kurir_data == null || kurir_data == "") {
+				// open the modal again
+				toastr.error("Kurir Tidak Boleh Kosong");
+				// await 2 sec
+				await new Promise(resolve => setTimeout(resolve, 500));
+				$('#modal-paket').modal('show');
+				// $('#select-kurir').focus();
+				return
+			}
+
+			const id_kurir = kurir_data.split('-')[0];
+			const nama_kurir = kurir_data.split('-')[1];
+			// console.log(id_kurir, nama_kurir);
+
+			swal({
+				title: "Tugaskan Kurir",
+				text: "Anda Akan Menugaskan Kurir " + nama_kurir + " Untuk Pengiriman Dengan No Resi " + id + "?",
+				type: "info",
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				confirmButtonColor: "#304ffe"
+			}, function (isConfirm) {
+				if (isConfirm) {
+					swal.close();
+					$.ajax({
+						url: '/admin/tugaskan-kurir',
+						type: 'POST',
+						data: {
+							id_kiriman: id,
+							id_kurir: id_kurir
+						},
+						beforeSend: function () {
+							blockUI("Menugaskan Kurir...");
+						},
+						complete: function () {
+							// close all swal
+							// swal.close();
+							$.unblockUI();
+						},
+						success: function (data) {
+							console.log(data);
+							// Hide the modal
+							$('#modal-paket').modal('show');
+							open_modal_paket(id);
+							// // destroy table
+							// $('#tb-paket').DataTable().destroy();
+							// reloadTable();
+							// // $.unblockUI();
+							swal({
+								title: "Berhasil!",
+								text: "Pengiriman Berhasil Ditugaskan",
+								type: "success",
+								timer: 2000, // time in milliseconds (2000ms = 2 seconds)
+								showConfirmButton: false
+							});
+						},
+						error: function (xhr, status, error) {
+							// console.error('AJAX error:', error);
+							$('#modal-paket').modal('show');
+							console.log(xhr.responseJSON);
+							toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+						}
+					});
+				} else {
+					// open the modal again
+					$('#modal-paket').modal('show');
+				}
+			})
+		}
+
+		function liat_info_kurir(nomor_telpon_kurir, stat) {
+			// console.log(stat)
+
+
+			// close modal-paket 
+			$('#modal-paket').modal('hide');
+			console.log(nomor_telpon_kurir)
+			selectClicked = false
+
+			$("#button-close-modal-kurir").attr("onclick", `close_modal_kurir(${stat})`);
+			$.ajax({
+				type: 'GET',
+				url: '/admin/kurir/' + nomor_telpon_kurir,
+				dataType: 'json',
+				beforeSend: function () {
+					blockUI('Loading')
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+
+				success: function (data) {
+					console.log(data)
+					$('#modal-kurir-title').html('Detail Kurir')
+					// hide form-gambar div
+					$("#form-gambar-kurir").attr("hidden", true);
+					$("#form-gambar-motor").attr("hidden", true);
+					$("#no_telpon-kurir").val(data.no_telpon)
+					$("#nama-kurir").val(data.nama)
+					$("#jenis-kelamin-kurir").val(data.jenis_kelamin)
+					$("#dd-motor-kurir").val(data.dd_motor)
+					// disable all input in #form-modal
+
+					enableInput(true)
+
+					var img = document.createElement('img');
+					img.src = 'admin/kurir/gambar/' + data.no_telpon + '/' + data.gambar_kurir;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					// Get the preview div
+					var previewDiv = document.getElementById('preview-gambar-kurir');
+					$('#show-upload-gambar-kurir').show();
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					var img = document.createElement('img');
+					img.src = 'admin/kurir/gambar/' + data.no_telpon + '/' + data.gambar_motor;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					// Get the preview div
+					var previewDiv = document.getElementById('preview-gambar-motor');
+					$('#show-upload-gambar-motor').show();
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img)
+
+					$('#modal-kurir').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+
+				},
+				error: function (xhr, status, error) {
+					// console.error('AJAX error:', error);
+					// $('#modal-paket').modal('show');
+					console.log(xhr.responseJSON);
+					toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+				}
+			})
+
+
+
+		}
+
+		function close_modal_kurir(stat) {
+			console.log(stat, "ini di close modal kurir")
+			$('#modal-kurir').modal('hide');
+
+			// 1.5 sec then open modal
+			setTimeout(function () {
+				$('#modal-paket').modal('show');
+				if (stat) {
+					console.log("jalankan stat")
+					// enable select
+					$("#select-kurir").attr("disabled", false);
+				}
+			}, 500);
+			// reloadTable(id);
+		}
+
+		$('#select-kurir').on('select2:select', function (e) {
+			const value = e.params.data.id;
+			const no_telpon_kurir = value.split('-')[2]
+			console.log(no_telpon_kurir)
+			liat_info_kurir(no_telpon_kurir, true)
+		});
+
+		// function selectKurir(ini) {
+		// 	const data = ini.value
+		// 	const no_telpon_kurir = data.split('-')[2]
+		// 	console.log(no_telpon_kurir)
+		// 	liat_info_kurir(no_telpon_kurir, true)
+
+		// }
+
+	</script>
+</body>
+
+</html>

routes/admin_ui/user.html

@@ -0,0 +1,322 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+    <meta name="description" content="">
+    <meta name="author" content="">
+
+    <title>Shenior Kurir | List User</title>
+
+    <!-- Main Styles -->
+    <link rel="stylesheet" href="/styles/style.min.css">
+
+    <!-- mCustomScrollbar -->
+    <link rel="stylesheet" href="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
+
+    <!-- Waves Effect -->
+    <link rel="stylesheet" href="/plugin/waves/waves.min.css">
+
+    <!-- Sweet Alert -->
+    <link rel="stylesheet" href="/plugin/sweet-alert/sweetalert.css">
+
+    <link rel="stylesheet" href="/fonts/fontello/fontello.css">
+
+    <link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
+    <link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
+
+    <link rel="stylesheet" href="/plugin/datatables/media/css/dataTables.bootstrap.min.css">
+
+    <!-- Toastr -->
+    <link rel="stylesheet" href="/plugin/toastr/toastr.css">
+</head>
+
+<body>
+    <div class="main-menu">
+        <header class="header">
+            <a href="/admin" class="logo">Shenior Kurir</a>
+            <button type="button" class="button-close fa fa-times js__menu_close"></button>
+            <div class="user">
+                <a href="#" class="avatar"><img src="/images/admin.png" alt=""><span class="status online"></span></a>
+                <h5 class="name"><a href="#">Admin</a></h5>
+                <h5 class="position">Admin</h5>
+
+            </div>
+            <!-- /.user -->
+        </header>
+        <!-- /.header -->
+        <div class="content">
+
+            <div class="navigation">
+                <h5 class="title">Navigasi</h5>
+                <!-- /.title -->
+                <ul class="menu js__accordion">
+                    <li>
+                        <a class="waves-effect" href="/admin"><i class="menu-icon fa fa-home"></i><span>Halaman
+                                Utama</span></a>
+                    </li>
+
+                    <li>
+                        <a class="waves-effect" href="/admin/kurir"><i
+                                class="menu-icon ico mdi mdi-motorbike"></i><span>List Kurir</span></a>
+                    </li>
+
+                    <li class="current active">
+                        <a class="waves-effect" href="/admin/user"><i class="menu-icon fa fa-users"></i><span>List
+                                User</span></a>
+                    </li>
+
+                    <li>
+						<a class="waves-effect" href="/admin/list" ><i
+								class="menu-icon ico icon-table"></i><span>List Penghantaran</span></a>
+					</li>
+
+
+                    <li>
+                        <a class="waves-effect" href="#" onclick="logout()"><i
+                                class="menu-icon ico icon-logout"></i><span>Logout</span></a>
+                    </li>
+                </ul>
+
+            </div>
+            <!-- /.navigation -->
+        </div>
+        <!-- /.content -->
+    </div>
+    <!-- /.main-menu -->
+
+    <div class="fixed-navbar">
+        <div class="pull-left">
+            <button type="button"
+                class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
+            <h1 class="page-title">List User</h1>
+            <!-- /.page-title -->
+        </div>
+        <!-- /.pull-left -->
+        <div class="pull-right">
+
+
+            <a href="#" class="ico-item ico icon-logout" onclick="logout()"></a>
+        </div>
+        <!-- /.pull-right -->
+    </div>
+    <!-- /.fixed-navbar -->
+
+    <div id="wrapper">
+        <div class="main-content">
+            <div class="row small-spacing">
+                <div class="col-xs-12">
+                    <div class="box-content card">
+                        <h4 class="box-title">Form User</h4>
+                        <!-- /.box-title -->
+                        <div class="card-content">
+
+                            <div class="form-group" style="overflow-x: auto;">
+                                <table id="tb-user" class="table table-striped table-bordered display"
+                                    style="width:100%">
+
+                                </table>
+                            </div>
+
+
+                        </div>
+                    </div>
+                    <!-- /.box-content -->
+                </div>
+
+
+
+            </div>
+            <footer class="footer">
+                <ul class="list-inline">
+                    <li>Arifuddin Naawi Amanah © 2025.</li>
+                    <!-- <li><a href="#">Privacy</a></li>
+				<li><a href="#">Terms</a></li>
+				<li><a href="#">Help</a></li> -->
+                </ul>
+            </footer>
+        </div>
+        <!-- /.main-content -->
+    </div><!--/#wrapper -->
+
+    <div class="modal fade" id="modal-kurir" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+        <div class="modal-dialog" role="document">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+                            aria-hidden="true">&times;</span></button>
+                    <h4 class="modal-title" id="modal-user-title">Modal title</h4>
+                </div>
+                <form class="modal-body" id="form-modal">
+                    <div class="form-group">
+                        <!-- show the upload -->
+                        <div id="show-upload-gambar-user" style="display: none">
+                            <center>
+                                <div id="preview-gambar-user" style="height: 200px; width: 150px"></div>
+                            </center>
+                        </div>
+                    </div>
+                    <div class="form-group">
+                        <label for="modal-user-nama">Nama</label>
+                        <input type="text" class="form-control" id="nama" placeholder="Masukkan Nama">
+                    </div>
+                    <div class="form-group">
+                        <label for="modal-user-nama">No Telpon/HP</label>
+                        <input type="text" class="form-control" id="no_telpon" oninput="numberOnly(this)" maxlength="13"
+                            placeholder="Masukkan No Telpon/HP">
+                    </div>
+
+                    <div class="form-group">
+                        <label for="alamat">Alamat </label>
+                        <textarea name="alamat" class="form-control" id="alamat" placeholder="Masukkan Alamat"
+                            style="resize: none"></textarea>
+                    </div>
+
+
+
+
+                </form>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-default btn-sm waves-effect waves-light"
+                        data-dismiss="modal">Close</button>
+
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+    <!--[if lt IE 9]>
+		<script src="/script/html5shiv.min.js"></script>
+		<script src="/script/respond.min.js"></script>
+	<![endif]-->
+    <!-- 
+	================================================== -->
+    <!-- Placed at the end of the document so the pages load faster -->
+    <script src="/scripts/jquery.min.js"></script>
+    <script src="/scripts/modernizr.min.js"></script>
+    <script src="/plugin/bootstrap/js/bootstrap.min.js"></script>
+    <script src="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+    <script src="/plugin/nprogress/nprogress.js"></script>
+    <script src="/plugin/sweet-alert/sweetalert.min.js"></script>
+    <script src="/plugin/waves/waves.min.js"></script>
+    <!-- Full Screen Plugin -->
+    <script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
+
+    <script src="/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
+    <script src="/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
+    <script src="/plugin/datatables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
+
+    <!-- Toastr -->
+    <script src="/plugin/toastr/toastr.min.js"></script>
+
+    <script src="/block/jquery.blockUI.js"></script>
+
+    <script src="/scripts/main.min.js"></script>
+    <script src="/my-js.js"></script>
+    <script>
+        function reloadTable() {
+            // destroy table
+            // $('#tb-kurir').DataTable().destroy();
+            $('#tb-user').DataTable({
+                // responsive: true,
+                scrollX: true,
+                // order: [
+                // 	[0, 'asc']
+                // ],
+                ajax: {
+                    url: '/admin/user/data',
+                    type: 'GET',
+                    timeout: 120000,
+                    dataSrc: function (data) {
+                        console.log(data)
+                        return data
+                    }
+                },
+                "sAjaxDataProp": "",
+                "aoColumns": [
+                    {
+                        "mData": "no_telpon",
+                        "title": "No Telpon",
+                        "render": function (data, type, row) {
+                            return data
+                        }
+                    },
+                    {
+                        "mData": "nama",
+                        "title": "Nama",
+                        "render": function (data, type, row) {
+                            return data
+                        }
+                    },
+                    {
+                        "mData": null,
+                        "title": "Aksi",
+                        "render": function (data, type, row) {
+                            return `<button type='button' onclick='open_modal_edit("${data._id}")' title='Detail Kurir' class='btn btn-info btn-circle btn-sm waves-effect waves-light'><i class='ico zmdi zmdi-info'></i></button>`
+                        }
+                    }
+                ]
+
+            })
+
+
+        }
+
+        reloadTable()
+
+       
+        function open_modal_edit(id) {
+            // console.log(id)
+            selectClicked = false
+            $.ajax({
+                type: 'GET',
+                url: '/admin/user/data/' + id,
+                dataType: 'json',
+                beforeSend: function () {
+                    blockUI('Loading')
+                },
+                success: function (data) {
+                    console.log(data)
+                    $('#modal-user-title').html('Detail Kurir')
+                    
+                    $("#no_telpon").val(data.no_telpon)
+                    $("#nama").val(data.nama)
+                    $("#alamat").val(data.alamat)
+                    // disable all input in #form-modal
+
+                    enableInput(true)
+                    
+                    $('#modal-kurir').modal('show')
+                    var img = document.createElement('img');
+                    img.src = 'kurir/gambar/' + data.no_telpon + '/' + data.gambar_kurir;
+                    img.style.maxWidth = '100%'; // Make the image fit the width of the div
+                    img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+                    // Get the preview div
+                    var previewDiv = document.getElementById('preview-gambar-user');
+                    $('#show-upload-gambar-user').show();
+                    // Clear any existing content in the preview div
+                    previewDiv.innerHTML = '';
+
+                    // Append the image to the preview div
+                    previewDiv.appendChild(img);
+
+                    
+
+
+                    $.unblockUI();
+                },
+                error: function (jqXHR, textStatus, errorThrown) {
+                    $.unblockUI();
+                    swal("Ups!", jqXHR.responseJSON.message ?? 'Something went wrong', "error");
+                }
+            })
+        }
+
+    </script>
+
+</body>
+
+</html>

routes/kurir_router.ts

@@ -5,6 +5,10 @@ import KurirModel from '../models/kurir_model';
 import type { UploadedFile } from 'express-fileupload';
 import path from 'path';
 import fs from 'fs';
+import UserModel from '../models/user_model';
+import KirimanModel from '../models/kiriman_model';
+import axios from 'axios';
+import { socket_client } from '../index';
 
 const router = express.Router();
 
@@ -12,6 +16,10 @@ router.get('/', (req: Request, res: Response) => {
     res.sendFile(__dirname + '/kurir_ui/index.html');
 });
 
+router.get('/penghantaran', (req: Request, res: Response) => {
+    res.sendFile(__dirname + '/kurir_ui/penghantaran.html');
+})
+
 router.get('/login', (req: Request, res: Response) => {
     res.sendFile(__dirname + '/kurir_ui/login.html');
 });
@@ -28,11 +36,11 @@ router.post('/login', async (req: Request, res: Response) => {
         res.status(400).json('Nomor Telpon atau Password Salah');
         return;
     } catch (error) {
-        console.log("error di kurir login",error);
+        console.log("error di kurir login", error);
         res.status(500).json('Terjadi Kesalahan Server');
         return;
     }
-    
+
 });
 
 router.get('/:jenis/:gambar', (req: Request, res: Response) => {
@@ -44,7 +52,19 @@ router.get('/:jenis/:gambar', (req: Request, res: Response) => {
     } else {
         res.status(404).send('Image not found');
     }
-    
+
+})
+
+router.get('/gambar-paket/:id/:gambar', (req: Request, res: Response) => {
+    const { id, gambar } = req.params;
+    const imagePath = path.join(__dirname, `../images/kiriman/${id}/${gambar}`);
+
+    if (fs.existsSync(imagePath)) {
+        res.sendFile(imagePath);
+    } else {
+        res.status(404).send('Image not found');
+    }
+
 })
 
 router.post('/check', async (req: Request, res: Response) => {
@@ -53,7 +73,7 @@ router.post('/check', async (req: Request, res: Response) => {
         return;
     }
     const { _id, no_telpon, password, createdAt } = req.body;
-    console.log(_id , no_telpon , password , createdAt);
+    console.log(_id, no_telpon, password, createdAt);
 
     // console.log(_id , no_telpon , password , createdAt);
     try {
@@ -74,6 +94,224 @@ router.post('/check', async (req: Request, res: Response) => {
 
 })
 
+router.get('/paket/:id/:status', async (req: Request, res: Response) => {
+    const { id, status } = req.params;
+    try {
+        const kirimanDoc = status == "ongoing" ? await KirimanModel.find({
+            id_kurir: id,
+            status: {
+                $nin: ['Dibatalkan Oleh Admin', 'Paket Telah Diterima Penerima',"Diterima Terverifikasi"],
+                $type: 'string'
+            }
+        }) : await KirimanModel.find({ id_kurir: id });
+        console.log(kirimanDoc);
+        res.status(200).json(kirimanDoc);
+    } catch (error) {
+        console.log(error);
+        res.status(500).json([]);
+    }
+})
 
+router.get('/user/:id', async (req: Request, res: Response) => {
+    const { id } = req.params;
+
+    try {
+        const user = await UserModel.findOne({ _id: id });
+        res.status(200).json(user);
+    } catch (error) {
+        console.log(error);
+        res.status(500).json();
+    }
+
+})
+
+router.delete('/batalkan-pengiriman/:id_kurir', async (req: Request, res: Response) => {
+    const { id_kurir } = req.params;
+    const { id, alasan } = req.body;
+    // console.log(id_kurir , id , alasan);
+
+    try {
+        const updatedDoc = await KirimanModel.findByIdAndUpdate(
+            id,
+            {
+                $set: {
+                    status: 'Dibatalkan Oleh Kurir , Admin mencari kurir baru',
+                    id_kurir: null
+                },
+                $push: {
+                    timeline: {
+                        status: 'Dibatalkan Oleh Kurir , Admin mencari kurir baru',
+                        waktu: new Date(),
+                        alasan: alasan || null,
+                        id_kurir
+                    }
+                }
+            },
+            { new: true } // Return the updated document
+
+        );
+
+        await KurirModel.findByIdAndUpdate(
+            id_kurir,
+            {
+                $set: {
+                    status: 'Tersedia'
+                }
+            },
+            { new: true } // Return the updated document
+        )
+        // console.log(updatedDoc);
+        const userData = await UserModel.findById(updatedDoc?.id_pengirim);
+        // const kurirData = await KurirModel.findById(id_kurir);
+
+        socket_client.emit('pembatalan_paket_kurir', updatedDoc);
+
+        try {
+            await axios.post('http://localhost:3012/send-message', { number: userData?.no_telpon, message: `🛵*_Kurir Shenior 🛵_*\nPengiriman anda dengan nomor resi ${updatedDoc?._id} telah dibatalkan oleh kurir\nAdmin akan menugaskan kurir yang baru\nHarap Bersabar'}* 🔄🔄` })
+        } catch (error) {
+            console.log(error)
+        }
+
+    } catch (error) {
+        console.log(error)
+        res.status(500).json();
+    }
+
+
+})
+
+
+// kurir menyetujui pengambilan pengiriman
+router.put('/mengambil-pengiriman/:id', async (req: Request, res: Response) => {
+    const { id: id_kiriman } = req.params;
+    const { id_kurir } = req.body;
+    console.log(id_kiriman, id_kurir);
+
+    // sini nnt berlaku update data
+    // const kirimanData = await KirimanModel.findById(id_kiriman);
+    const kirimanDoc = await KirimanModel.findByIdAndUpdate(
+        id_kiriman,
+        {
+            $set: {
+                id_kurir: id_kurir,
+                status: 'Kurir Dalam Perjalanan',
+            },
+            $push: {
+                timeline: {
+                    status: 'Kurir Dalam Perjalanan',
+                    waktu: new Date(),
+                    alasan: null,
+                    id_kurir
+                }
+            }
+        },
+        { new: true } // Return the updated document
+    );
+
+    const userData = await UserModel.findById(kirimanDoc?.id_pengirim);
+    const kurirData = await KurirModel.findById(id_kurir);
+
+
+    try {
+        await axios.post('http://localhost:3012/send-message', { number: userData?.no_telpon, message: `🛵*_Kurir Shenior_* 🛵 \nPengiriman anda dengan nomor resi *${id_kiriman}* telash disetujui oleh kurir.\n Kurir sekarang berangkat ke alamat pengirim untuk mengambil paket, Silakan menunggu} ➡️➡️` })
+        await axios.post('http://localhost:3012/send-message', { number: kurirData?.no_telpon, message: `🛵*_Kurir Shenior_* 🛵 \nAnda telah ditugaskan untuk mengambil paket dengan nomor resi *${id_kiriman}* \nAlamat Pengirim : *${kirimanDoc?.alamat_pengirim}* \nNama Pengirim: *${kirimanDoc?.nama_pengirim}*` })
+    } catch (error) {
+        console.log("Error Mengambil Pengiriman | Kurir");
+        console.log(error);
+    }
+
+
+
+    // notifikasi ke aplikasi (admin dan user)
+    socket_client.emit('kurir_mengambil_pengiriman', kirimanDoc);
+
+
+    res.status(200).json("ini mengambil pengiriman");
+
+})
+
+router.post('/mengambil-pengiriman-dari-pengirim-ke-penerima/:id', async (req: Request, res: Response) => {
+    const { id: id_kiriman } = req.params;
+    const { id_kurir, status } = req.body;
+
+    const { foto_paket } = req.files as {
+        foto_paket: UploadedFile;
+
+    };
+
+    // console.log(id_kiriman, id_kurir);
+    // console.log(foto_paket);
+
+    const random_5_char = Math.random().toString(36).substring(2, 7);
+    const nama_foto = `${random_5_char}-${foto_paket.name}`;
+
+    const paketDir = path.join(__dirname, `../images/kiriman/${id_kiriman}`);
+    const paketPath = path.join(paketDir, `${nama_foto}`);
+
+    console.log(paketPath);
+    fs.mkdirSync(paketDir, { recursive: true });
+
+    // move photo
+    await foto_paket.mv(paketPath);
+
+
+    // const kirimanDoc = await KirimanModel.findById(id_kiriman);
+    const kirimanDoc = await KirimanModel.findByIdAndUpdate(
+        id_kiriman,
+        {
+            $set: {
+                id_kurir: id_kurir,
+                status: status == "mengirim" ? 'Mengirim Paket Ke Alamat Penerima' : 'Paket Telah Diterima Penerima',
+            },
+            $push: {
+                timeline: {
+                    status: status == "mengirim" ? 'Mengirim Paket Ke Alamat Penerima' : 'Paket Telah Diterima Penerima',
+                    waktu: new Date(),
+                    alasan: null,
+                    id_kurir,
+                    gambar: nama_foto
+                }
+            }
+        },
+        { new: true } // Return the updated document
+    );
+
+
+    const userData = await UserModel.findById(kirimanDoc?.id_pengirim);
+    // const kurirData = await KurirModel.findById(id_kurir);
+    if (status == "menerima") {
+        await KurirModel.findByIdAndUpdate(
+            id_kurir,
+            {
+                $set: {
+                    status: 'Tersedia'
+                }
+            }
+        )
+    }
+
+
+    // console.log(kirimanDoc);
+    // console.log(userData);
+    // console.log(kurirData);
+
+    try {
+        const mes = status == "mengirim" ? `🛵*_Kurir Shenior_* 🛵 \nPengiriman anda dengan nomor resi *${id_kiriman}* telah diambil oleh kurir.\nSilakan menunggu kurir mengantarkan paket ke alamat penerima di *${kirimanDoc?.alamat_penerima}*` : `🛵*_Kurir Shenior_* 🛵 \nPengiriman anda dengan nomor resi *${id_kiriman}* telah diterima oleh penerima.`
+        await axios.post('http://localhost:3012/send-message', { number: userData?.no_telpon, message: mes, img_stat: true, foto_paket: paketPath, foto_name: foto_paket.name })
+        // await axios.post('http://localhost:3012/send-message', { number: kurirData?.no_telpon, message: `🛵*_Kurir Shenior_* 🛵 \nAnda telah mengambil paket dengan nomor resi *${id_kiriman}* di alamat pengirim dan akan menghantar ke \nAlamat Penerima : *${kirimanDoc?.alamat_penerima}* \nNama Penerima: *${kirimanDoc?.nama_penerima}*` ,img_stat:true , foto_paket : paketPath, foto_name : foto_paket.name})
+    } catch (error) {
+        console.log("Error Mengambil Pengiriman di pengirim | Kurir");
+        console.log(error);
+    }
+
+    socket_client.emit('kurir_menghantar_ke_penerima', kirimanDoc);
+
+    res.status(200).json("sukses");
+})
+
+// log penghantaran menu
+router.get('/log', async (req: Request, res: Response) => {
+    res.sendFile(__dirname + '/kurir_ui/log.html');
+})
 
 export default router;

routes/kurir_ui/index.html

@@ -24,6 +24,9 @@
 
 	<link rel="stylesheet" href="/fonts/fontello/fontello.css">
 
+	<!-- Toastr -->
+	<link rel="stylesheet" href="/plugin/toastr/toastr.css">
+
 	<link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
 	<link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
 	<script src="/auth.js"></script>
@@ -66,7 +69,7 @@
 					</li> -->
 
 					<li>
-						<a class="waves-effect" href="#" onclick="notAvailable()"><i
+						<a class="waves-effect" href="/kurir/log" ><i
 								class="menu-icon ico icon-table"></i><span>Log Penghantaran</span></a>
 					</li>
 
@@ -269,6 +272,9 @@
 	<!-- Full Screen Plugin -->
 	<script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
 
+	<!-- Toastr -->
+	<script src="/plugin/toastr/toastr.min.js"></script>
+
 	<script src="/scripts/main.min.js"></script>
 	<script src="/my-js.js"></script>
 	<script src="/socketnya/client-dist/socket.io.js"></script>
@@ -292,7 +298,6 @@
 		img2.height = 200;
 		document.getElementById('preview-gambar-kurir').appendChild(img2);
 
-		document.getElementById('h5-title').innerHTML = global_data.nama;
 
 		$("#nama").val(global_data.nama);
 		$("#no_telpon").val(global_data.no_telpon);
@@ -300,6 +305,7 @@
 		$("#jenis-kelamin").val(global_data.jenis_kelamin);
 		$("#dd-motor").val(global_data.dd_motor);
 	</script>
+	<script src="/kurir.js"></script>
 
 </body>
 

routes/kurir_ui/log.html

@@ -0,0 +1,912 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+	<meta name="description" content="">
+	<meta name="author" content="">
+
+	<title>Shenior Kurir | Log Penghantaran</title>
+
+	<!-- Main Styles -->
+	<link rel="stylesheet" href="/styles/style.min.css">
+
+	<!-- mCustomScrollbar -->
+	<link rel="stylesheet" href="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
+
+	<!-- Waves Effect -->
+	<link rel="stylesheet" href="/plugin/waves/waves.min.css">
+
+	<!-- Sweet Alert -->
+	<link rel="stylesheet" href="/plugin/sweet-alert/sweetalert.css">
+
+	<link rel="stylesheet" href="/fonts/fontello/fontello.css">
+
+	<link rel="stylesheet" href="/plugin/datatables/media/css/dataTables.bootstrap.min.css">
+
+	<!-- Toastr -->
+	<link rel="stylesheet" href="/plugin/toastr/toastr.css">
+
+	<link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
+	<link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
+	<script src="/auth.js"></script>
+</head>
+
+<body>
+	<div class="main-menu">
+		<header class="header">
+			<a href="/admin" class="logo">Shenior Kurir</a>
+			<button type="button" class="button-close fa fa-times js__menu_close"></button>
+			<div class="user">
+				<a href="#" class="avatar"><img src="/images/admin.png" id="img-avatar" alt=""><span
+						class="status online"></span></a>
+				<h5 class="name"><a href="#" id="h5-title">...</a></h5>
+				<h5 class="position">Kurir</h5>
+
+			</div>
+			<!-- /.user -->
+		</header>
+		<!-- /.header -->
+		<div class="content">
+
+			<div class="navigation">
+				<h5 class="title">Navigasi</h5>
+				<!-- /.title -->
+				<ul class="menu js__accordion">
+					<li>
+						<a class="waves-effect" href="/kurir"><i class="menu-icon fa fa-home"></i><span>Halaman
+								Utama</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/kurir/penghantaran"><i
+								class="menu-icon ico mdi mdi-motorbike"></i><span>Pengiriman Paket</span></a>
+					</li>
+
+					<!-- <li>
+						<a class="waves-effect" href="#" onclick="notAvailable()"><i
+								class="menu-icon fa fa-users"></i><span>List User</span></a>
+					</li> -->
+
+					<li class="current active">
+						<a class="waves-effect" href="/kurir/log"><i class="menu-icon ico icon-table"></i><span>Log
+								Penghantaran</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/kurir/profil"><i
+								class="menu-icon fa fa-unlock-alt"></i><span>Ganti Password</span></a>
+					</li>
+
+
+					<li>
+						<a class="waves-effect" href="#" onclick="logout()"><i
+								class="menu-icon ico icon-logout"></i><span>Logout</span></a>
+					</li>
+				</ul>
+
+			</div>
+			<!-- /.navigation -->
+		</div>
+		<!-- /.content -->
+	</div>
+	<!-- /.main-menu -->
+
+	<div class="fixed-navbar">
+		<div class="pull-left">
+			<button type="button"
+				class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
+			<h1 class="page-title">Halaman Utama</h1>
+			<!-- /.page-title -->
+		</div>
+		<!-- /.pull-left -->
+		<div class="pull-right">
+
+
+			<a href="#" class="ico-item ico icon-logout" onclick="logout()"></a>
+		</div>
+		<!-- /.pull-right -->
+	</div>
+	<!-- /.fixed-navbar -->
+
+	<div id="wrapper">
+		<div class="main-content">
+			<div class="row">
+
+				<div class="col-lg-6 col-md-6 col-xs-6">
+					<div class="box-content">
+						<h4 class="box-title">Jumlah Log Penghantaran</h4>
+						<!-- /.box-title -->
+
+						<!-- /.dropdown js__dropdown -->
+						<div class="content">
+							<div class="row small-spacing">
+								<div class="col-xs-6">
+									<img src="/images/kiriman.png" alt="" style="width: 100%;">
+								</div>
+								<!-- show this icon ico icon-users-1 -->
+
+								<div class="col-xs-6">
+									<div class="right-content">
+										<h2 class="murid-counter"></h2>
+										<!-- /.counter -->
+										<p class="text">Orang</p>
+										<!-- /.text -->
+									</div>
+								</div>
+								<!-- /.right-content -->
+							</div>
+						</div>
+						<!-- /.content -->
+					</div>
+					<!-- /.box-content -->
+				</div>
+				<div class="col-lg-6 col-md-6 col-xs-6">
+					<div class="box-content">
+						<h4 class="box-title">Jumlah Penghantaran Sukses</h4>
+						<!-- /.box-title -->
+
+						<!-- /.dropdown js__dropdown -->
+						<div class="content">
+							<div class="row small-spacing">
+								<div class="col-xs-6">
+									<img src="/images/kiriman2.png" alt="" style="width: 100%;">
+								</div>
+								<!-- show this icon ico icon-users-1 -->
+
+								<div class="col-xs-6">
+									<div class="right-content">
+										<h2 class="staf-counter"></h2>
+										<!-- /.counter -->
+										<p class="text">Orang</p>
+										<!-- /.text -->
+									</div>
+								</div>
+								<!-- /.right-content -->
+							</div>
+						</div>
+						<!-- /.content -->
+					</div>
+					<!-- /.box-content -->
+				</div>
+				<!-- <div class="col-xs-12">
+					<div class="box-content card">
+						<img src="/images/habibie.jpg" alt="" style="width: 100%; border-radius: 30px;">
+					</div>
+				</div> -->
+			</div>
+			<div class="row small-spacing">
+				<div class="box-content card">
+					<h4 class="box-title">Form Pengiriman Paket</h4>
+					<!-- /.box-title -->
+					<div class="card-content">
+						<div class="form-group text-center" id="text-tiada-pengiriman">
+							<p>Tidak ada pengiriman</p>
+						</div>
+						<div class="form-group" id="form-tb-paket">
+							<table id="tb-paket" class="table table-striped table-bordered display" style="width:100%">
+
+							</table>
+						</div>
+					</div>
+				</div>
+			</div>
+			<footer class="footer">
+				<ul class="list-inline">
+					<li>Arifuddin Naawi Amanah © 2025.</li>
+					<!-- <li><a href="#">Privacy</a></li>
+				<li><a href="#">Terms</a></li>
+				<li><a href="#">Help</a></li> -->
+				</ul>
+			</footer>
+		</div>
+		<!-- /.main-content -->
+	</div><!--/#wrapper -->
+
+	<div class="modal fade" id="modal-paket" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-paket-title">Modal title</h4>
+				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-paket" style="display: none">
+							<center>
+								<div id="preview-gambar-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-paket">
+						<!-- create upload -->
+						<label for="modal-paket-nama">Photo Paket</label>
+						<input type="file" class="form-control" id="gambar-paket" accept="image/*"
+							onchange="showUpload(this, 'gambar-paket')">
+					</div>
+
+					<div class="form-group" id="div-nomor-resi" style="display: none">
+						<label for="modal-paket-nomor-resi">Nomor Resi</label>
+						<input type="text" class="form-control" id="nomor_resi">
+					</div>
+
+					<div class="form-group" id="div-nomor-pengguna">
+						<label for="modal-paket-pengguna">Pengguna</label>
+						<input type="text" class="form-control" id="pengguna">
+					</div>
+
+					<div class="form-group" id="div-waktu-dibuat" style="display: none">
+						<label for="modal-paket-waktu-dibuat">Waktu Dibuat</label>
+						<input type="text" class="form-control" id="waktu_dibuat">
+					</div>
+
+					<div class="form-group" id="div-status" style="display: none">
+						<label for="modal-paket-div-status">Status</label>
+						<input type="text" class="form-control" id="status">
+					</div>
+
+					<hr>
+					<hr>
+
+
+					<div class="form-group">
+						<label for="modal-paket-nama-pengirim">Nama Pengirim</label>
+						<input type="text" class="form-control" id="nama_pengirim" placeholder="Masukkan Nama Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-pengirim">No Telpon/HP Pengirim</label>
+						<input type="text" class="form-control" id="no_telpon_pengirim" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-pengirim">Alamat Pengirim</label>
+						<textarea name="alamat_pengirim" class="form-control" id="alamat_pengirim"
+							placeholder="Masukkan Alamat Pengirim" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-nama-penerima">Nama Penerima</label>
+						<input type="text" class="form-control" id="nama_penerima" placeholder="Masukkan Nama Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-penerima">No Telpon/HP Penerima</label>
+						<input type="text" class="form-control" id="no_telpon_penerima" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-penerima">Alamat Penerima</label>
+						<textarea name="alamat_penerima" class="form-control" id="alamat_penerima"
+							placeholder="Masukkan Alamat Penerima" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-berat">Kurir Yang Ditugaskan</label>
+						<input type="text" class="form-control" id="input_kurir" style="display: none">
+					</div>
+
+					<hr>
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-foto-paket" style="display: none">
+							<center>
+								<div id="preview-foto-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-foto-paket">
+						<!-- create upload -->
+						<label id="modal-paket-fotonya">Photo Paket</label>
+						<input type="file" class="form-control" id="foto-paket" accept="image/*"
+							onchange="showUpload(this, 'foto-paket')">
+					</div>
+					<hr>
+
+
+					<div class="form-group">
+						<label for="modal-paket-berat">Progress</label>
+						<div class="activity-list">
+						</div>
+					</div>
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-xs btn-default btn-sm waves-effect waves-light"
+						data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-xs btn-danger btn-sm waves-effect waves-light"
+						id="btn-batalkan-paket">Batalkan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-primary btn-sm waves-effect waves-light"
+						id="btn-mengambil-paket">Berangkat Mengambil Paket</button>
+
+				</div>
+			</div>
+		</div>
+	</div>
+
+
+	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+	<!--[if lt IE 9]>
+		<script src="/script/html5shiv.min.js"></script>
+		<script src="/script/respond.min.js"></script>
+	<![endif]-->
+	<!-- 
+	================================================== -->
+	<!-- Placed at the end of the document so the pages load faster -->
+	<script src="/scripts/jquery.min.js"></script>
+	<script src="/scripts/modernizr.min.js"></script>
+	<script src="/plugin/bootstrap/js/bootstrap.min.js"></script>
+	<script src="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+	<script src="/plugin/nprogress/nprogress.js"></script>
+	<script src="/plugin/sweet-alert/sweetalert.min.js"></script>
+	<script src="/plugin/waves/waves.min.js"></script>
+	<!-- Full Screen Plugin -->
+	<script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
+
+	<!-- Toastr -->
+	<script src="/plugin/toastr/toastr.min.js"></script>
+
+	<script src="/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
+	<script src="/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
+	<script src="/plugin/datatables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
+
+	<script src="/block/jquery.blockUI.js"></script>
+
+	<script src="/scripts/main.min.js"></script>
+	<script src="/my-js.js"></script>
+	<script src="/socketnya/client-dist/socket.io.js"></script>
+	<script>
+		const global_data = JSON.parse(localStorage.getItem('user'));
+		console.log(global_data);
+
+	</script>
+	<script>
+		function reloadTable() {
+			// destroy table
+			// $('#tb-kurir').DataTable().destroy();
+			$('#tb-paket').DataTable({
+				// responsive: true,
+				scrollX: true,
+				// order: [
+				// 	[0, 'asc']
+				// ],
+				ajax: {
+					url: '/kurir/paket/' + global_data._id + '/all',
+					type: 'GET',
+					timeout: 120000,
+					dataSrc: function (data) {
+						console.log(data)
+						if (data.length == 0) {
+							$("#form-tb-paket").hide();
+							$("#text-tiada-pengiriman").show();
+						} else {
+							$("#form-tb-paket").show();
+							$("#text-tiada-pengiriman").hide();
+						}
+						return data.reverse();
+					}
+				},
+				"sAjaxDataProp": "",
+				"aoColumns": [
+					// {
+					// 	"mData": "_id",
+					// 	"title": "No Resi",
+					// 	"render": function (data, type, row) {
+					// 		return data
+					// 	}
+					// },
+					{
+						"mData": "nama_pengirim",
+						"title": "Nama Pengirim",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "nama_penerima",
+						"title": "Nama Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "alamat_penerima",
+						"title": "Alamat Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "status",
+						"title": "Status",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": null,
+						"title": "Aksi",
+						"render": function (data, type, row) {
+							return `<button type='button' onclick='open_modal_paket("${data._id}")' title='Detail Pengiriman' class='btn btn-info btn-circle btn-sm waves-effect waves-light'><i class='ico zmdi zmdi-info'></i></button> `
+						}
+					}
+				]
+
+			})
+
+
+		}
+
+		reloadTable()
+
+				function showUpload(element, stat) {
+			console.log(element.files);
+			console.log(stat);
+			var file = element.files[0];
+
+			if (file) {
+				var reader = new FileReader();
+				reader.onload = function (event) {
+					var imageUrl = event.target.result;
+
+					// Create an image element
+					var img = document.createElement('img');
+					img.src = imageUrl;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					const id = 'show-upload-' + stat
+
+					const id_preview = 'preview-' + stat
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+				}
+				reader.readAsDataURL(file);
+			}
+		}
+
+
+
+	</script>
+	<script src="/kurir.js"></script>
+
+	<script>
+		async function open_modal_paket(id) {
+			$.ajax({
+				url: '/user/paket-detail/' + id,
+				type: 'GET',
+				timeout: 20000,
+				beforeSend: function () {
+					blockUI('Loading Data...');
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+				success: function (data) {
+					// Handle the response here
+					console.log(data.timeline);
+
+					if (data.id_kurir != null && data.id_kurir != undefined && data.id_kurir != "") {
+						// // hide select kurir
+						// $("#div-select-kurir").hide();
+						// // show input_kurir
+						$("#input_kurir").show();
+						$("#input_kurir").val(global_data.nama);
+
+						// // hide batal button
+						// $("#btn-batalkan-paket").hide();
+
+						// // hide btn-tugaskan-kurir
+						// $("#btn-tugaskan-kurir").hide();
+					} else {
+						// // show select kurir
+						// $("#div-select-kurir").show();
+						// // hide input_kurir
+						$("#input_kurir").hide();
+						// show batal button
+						// $("#btn-batalkan-paket").show();
+
+						// // show btn-tugaskan-kurir
+						// $("#btn-tugaskan-kurir").show();
+					}
+
+					// let waktu_dibuat = new Date(data.createdAt);
+
+					$("#show-upload-foto-paket").hide();
+					$("#foto-paket").val("");
+
+					const userData = $.ajax({
+						url: '/kurir/user/' + data.id_pengirim,
+						type: 'GET',
+						timeout: 20000,
+						async: false
+					}).responseJSON;
+
+					// console.log(userData);
+
+					$("#pengguna").val(userData.nama);
+
+					$('#modal-paket-title').html('Form Detail Pengiriman Paket');
+
+					// $("#id").val(data._id);
+					$("#div-nomor-resi").show();
+					$("#nomor_resi").val(data._id);
+					$("#div-waktu-dibuat").show();
+					$("#waktu_dibuat").val(formatToMakassar(data.createdAt));
+					$("#div-status").show();
+					$("#status").val(data.status);
+					$("#no_telpon_pengirim").val(data.no_telpon_pengirim);
+					$("#nama_pengirim").val(data.nama_pengirim);
+					$("#alamat_pengirim").val(data.alamat_pengirim);
+					$("#no_telpon_penerima").val(data.no_telpon_penerima);
+					$("#nama_penerima").val(data.nama_penerima);
+					$("#alamat_penerima").val(data.alamat_penerima);
+					// $("#gambar-paket").attr("src", data.gambar_paket);
+
+					var img = document.createElement('img');
+					img.src = "/user/paket-detail/" + data._id + "/" + data.gambar_paket;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
+
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					// disable all input in #form-modal
+					$("#form-gambar-paket").hide();
+
+					$('#form-modal :input').prop('disabled', true);
+
+					// make select enabled
+					$("#select-kurir").prop('disabled', false);
+
+
+					let activity_html = '';
+					for (let i = data.timeline.length - 1; i >= 0; i--) {
+						let colornya = 'bg-info';
+
+						if (data.timeline[i].status == 'Paket Telah Diterima Penerima') {
+							colornya = 'bg-success';
+						}
+
+						if (data.timeline[i].status.includes('Dibatalkan')) {
+							colornya = 'bg-danger';
+						}
+
+						activity_html += `<div class="activity-item">
+							<div class="bar ${colornya}">
+							<div class="dot ${colornya}"></div>
+							</div>
+							<div class="content">
+							<div class="date">${formatToMakassar(data.timeline[i].waktu)}</div>
+							<div class="text">
+								${data.timeline[i].status}
+								${!data.timeline[i].gambar ? "" : `<br><img src="/kurir/gambar-paket/${data._id}/${data.timeline[i].gambar}" width="100px" height="100px">`} 
+							</div>
+							</div>
+						</div>`;
+					}
+
+					$('.activity-list').html(activity_html);
+
+					// sign a onclick on #btn-batalkan-paket
+					$('#btn-batalkan-paket').hide();
+					// if data.status == "Kurir Telah Ditugaskan"
+					if (data.status == "Kurir Telah Ditugaskan") {
+						$('#btn-batalkan-paket').attr('onclick', `batalkan_pengiriman('${data._id}')`);
+						$('#btn-batalkan-paket').show();
+					}
+
+
+
+					global_detail_paket = data;
+					// sign a onclick on #btn-tugaskan-kurir
+					const nama_function = data.status == "Kurir Telah Ditugaskan" ? `mengambil_paket('${data._id}')` : data.status == "Kurir Dalam Perjalanan" ? `foto_paket_lokasi_pengirim('${data._id}','mengirim')` : data.status == "Mengirim Paket Ke Alamat Penerima" ? `foto_paket_lokasi_pengirim('${data._id}','menerima')` : null
+
+					const ket_function = data.status == "Kurir Telah Ditugaskan" ? "Mengambil Paket" : data.status == "Kurir Dalam Perjalanan" ? "Hantar Paket Ke Lokasi Penerima" : data.status == "Mengirim Paket Ke Alamat Penerima" ? "Paket Diterima Oleh Penerima" : null
+
+					console.log(nama_function);
+
+					$('#btn-mengambil-paket').attr('onclick', nama_function);
+					$('#btn-mengambil-paket').html(ket_function);
+					$("#btn-mengambil-paket").show();
+
+					if (data.status == "Kurir Dalam Perjalanan" || data.status == "Mengirim Paket Ke Alamat Penerima") {
+						$("#form-foto-paket").show();
+						// $("#show-upload-foto-paket").show();
+						// enable foto-paket
+						$("#foto-paket").prop('disabled', false);
+						$("#modal-paket-fotonya").html("Foto Paket Pengiriman");
+					}
+
+					if (data.status == "Kurir Telah Ditugaskan" || data.status == "'Menunggu Admin Memproses" || data.status == "Diterima Terverifikasi") {
+						// enable foto-paket
+						$("#form-foto-paket").hide();
+						$("#show-upload-foto-paket").hide();
+						if (data.status == "Diterima Terverifikasi") {
+							// hide
+							$('#btn-mengambil-paket').hide();
+						}
+					}
+
+					
+
+					$('#modal-paket').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+				},
+				error: function (xhr, status, error) {
+					console.error('AJAX error:', error);
+				}
+			});
+		}
+
+				function batalkan_pengiriman(id) {
+			// Hide the modal first
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "",
+				text: "Silakan tulis alasan pembatalan:",
+				type: "input",
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				inputPlaceholder: "Contoh: Ada Urusan Lain",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					$('#modal-paket').modal('show');
+					return false;
+				}
+				if (inputValue === "") {
+					swal("Oops!", "Alasan tidak boleh kosong!", "error");
+					// open the modal again
+					$('#modal-paket').modal('show');
+					return false;
+				}
+
+				// close the swal
+				swal.close();
+				console.log(inputValue);
+
+				$.ajax({
+					url: '/kurir/batalkan-pengiriman/' + global_data._id,
+					type: 'DELETE',
+					data: {
+						id: id,
+						alasan: inputValue
+					},
+					beforeSend: function () {
+						blockUI("Melakukan Pembatalan Pengiriman...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data);
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// // destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						// // $.unblockUI();
+						swal({
+							title: "Berhasil!",
+							text: "Pengiriman Berhasil Dibatalkan",
+							type: "success",
+							timer: 2000, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				});
+			});
+
+
+
+
+
+		}
+
+
+
+		function mengambil_paket(id) {
+			console.log(id);
+			// console.log(global_detail_paket);
+			// Hide the modal first
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "Mengambil Paket",
+				type: "info",
+				text: "Alamat : <b><i>" + global_detail_paket.alamat_pengirim + "</></b><br>Nama Pengirim :<i><b>" + global_detail_paket.nama_pengirim + "</b></i>",
+				html: true,
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					$('#modal-paket').modal('show');
+					return false;
+				}
+
+				swal.close();
+
+				$.ajax({
+					url: '/kurir/mengambil-pengiriman/' + id,
+					type: 'PUT',
+					data: {
+						id_kurir: global_data._id
+					},
+					beforeSend: function () {
+						blockUI("Mengambil Paket...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data);
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// // destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						// // $.unblockUI();
+						swal({
+							title: "Berhasil!",
+							text: "Status Pengiriman Berhasil Diubah,\nAnda Sekarang Dalam Perjalanan Mengambil Paket Dari Pengirim",
+							type: "success",
+							timer: 3500, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				});
+
+				// swal({
+				// 	title: "Berhasil!",
+				// 	text: "Status Pengiriman Berhasil Diubah,\nAnda Sekarang Mengambil Paket",
+				// 	type: "success",
+				// 	timer: 2000, // time in milliseconds (2000ms = 2 seconds)
+				// 	showConfirmButton: false
+				// });
+			})
+		}
+
+
+
+
+		function foto_paket_lokasi_pengirim(id, stat) {
+			// Hide the modal first
+			// $('#modal-paket').modal('hide');
+
+			// console.log(id);
+			const foto_paket = $('#foto-paket').val();
+
+			if (foto_paket == "") {
+				toastr.error("Foto Paket Tidak Boleh Kosong");
+				$('#foto-paket').focus();
+				return;
+			}
+
+			let formdata = new FormData();
+			formdata.append('foto_paket', $('#foto-paket')[0].files[0]);
+			// formdata.append('id_paket', id);
+			formdata.append('id_kurir', global_data._id);
+			formdata.append('status', stat);
+
+			$('#modal-paket').modal('hide');
+
+
+			swal({
+				title: stat == "mengirim" ? "Hantar Paket Ke Alamat Penerima" : "Paket Diterima Oleh Penerima",
+				type: stat == "mengirim" ? "info" : "success",
+				text: stat == "mengirim" ? "Alamat : <b><i>" + global_detail_paket.alamat_penerima + "</></b><br>Nama Penerima :<i><b>" + global_detail_paket.nama_penerima + "</b></i><br>No Telpon/HP Penerima :<i><b>" + global_detail_paket.no_telpon_penerima + "</b></i>" : "",
+				html: true,
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					console.log('cancel');
+					$('#modal-paket').modal('show');
+					return false;
+				}
+				// $('#modal-paket').modal('show');
+				// return false;
+
+				swal.close();
+
+				$.ajax({
+					url: '/kurir/mengambil-pengiriman-dari-pengirim-ke-penerima/' + id,
+					type: 'POST',
+					data: formdata,
+					processData: false,
+					contentType: false,
+					beforeSend: function () {
+						blockUI("Mengirim Paket...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data);
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// // destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						swal({
+							title: "Berhasil!",
+							text: stat == "mengirim" ? "Status Pengiriman Berhasil Diubah,\nAnda Sekarang Mengirim Paket Ke Alamat Penerima Di <b>" + global_detail_paket.alamat_penerima + "</b>" : "Paket Telah Diterima Oleh Penerima",
+							html: true,
+							type: "success",
+							timer: 3000, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+
+
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+						$('#modal-paket').modal('show');
+					}
+				});
+			});
+
+
+		}
+
+
+
+	</script>
+
+</body>
+
+</html>

routes/kurir_ui/penghantaran.html

@@ -0,0 +1,837 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+	<meta name="description" content="">
+	<meta name="author" content="">
+
+	<title>Shenior Kurir | Pengiriman Paket</title>
+
+	<!-- Main Styles -->
+	<link rel="stylesheet" href="/styles/style.min.css">
+
+	<!-- mCustomScrollbar -->
+	<link rel="stylesheet" href="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
+
+	<!-- Waves Effect -->
+	<link rel="stylesheet" href="/plugin/waves/waves.min.css">
+
+	<!-- Sweet Alert -->
+	<link rel="stylesheet" href="/plugin/sweet-alert/sweetalert.css">
+
+	<link rel="stylesheet" href="/fonts/fontello/fontello.css">
+
+	<link rel="stylesheet" href="/plugin/datatables/media/css/dataTables.bootstrap.min.css">
+
+	<!-- Toastr -->
+	<link rel="stylesheet" href="/plugin/toastr/toastr.css">
+
+	<link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
+	<link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
+	<script src="/auth.js"></script>
+</head>
+
+<body>
+	<div class="main-menu">
+		<header class="header">
+			<a href="/kurir" class="logo">Shenior Kurir</a>
+			<button type="button" class="button-close fa fa-times js__menu_close"></button>
+			<div class="user">
+				<a href="#" class="avatar"><img src="/images/admin.png" id="img-avatar" alt=""><span
+						class="status online"></span></a>
+				<h5 class="name"><a href="#" id="h5-title">...</a></h5>
+				<h5 class="position">Kurir</h5>
+
+			</div>
+			<!-- /.user -->
+		</header>
+		<!-- /.header -->
+		<div class="content">
+
+			<div class="navigation">
+				<h5 class="title">Navigasi</h5>
+				<!-- /.title -->
+				<ul class="menu js__accordion">
+					<li>
+						<a class="waves-effect" href="/kurir"><i class="menu-icon fa fa-home"></i><span>Halaman
+								Utama</span></a>
+					</li>
+
+					<li class="current active">
+						<a class="waves-effect" href="/kurir/penghantaran"><i
+								class="menu-icon ico mdi mdi-motorbike"></i><span>Pengiriman Paket</span></a>
+					</li>
+
+					<!-- <li>
+						<a class="waves-effect" href="#" onclick="notAvailable()"><i
+								class="menu-icon fa fa-users"></i><span>List User</span></a>
+					</li> -->
+
+					<li>
+						<a class="waves-effect" href="/kurir/log" ><i
+								class="menu-icon ico icon-table"></i><span>Log Penghantaran</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/kurir/profil"><i
+								class="menu-icon fa fa-unlock-alt"></i><span>Ganti Password</span></a>
+					</li>
+
+
+					<li>
+						<a class="waves-effect" href="#" onclick="logout()"><i
+								class="menu-icon ico icon-logout"></i><span>Logout</span></a>
+					</li>
+				</ul>
+
+			</div>
+			<!-- /.navigation -->
+		</div>
+		<!-- /.content -->
+	</div>
+	<!-- /.main-menu -->
+
+	<div class="fixed-navbar">
+		<div class="pull-left">
+			<button type="button"
+				class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
+			<h1 class="page-title">Pengiriman Paket</h1>
+			<!-- /.page-title -->
+		</div>
+		<!-- /.pull-left -->
+		<div class="pull-right">
+
+
+			<a href="#" class="ico-item ico icon-logout" onclick="logout()"></a>
+		</div>
+		<!-- /.pull-right -->
+	</div>
+	<!-- /.fixed-navbar -->
+
+	<div id="wrapper">
+		<div class="main-content">
+			<div class="row small-spacing">
+				<div class="box-content card">
+					<h4 class="box-title">Form Pengiriman Paket Berjalan</h4>
+					<!-- /.box-title -->
+					<div class="card-content">
+						<div class="form-group text-center" id="text-tiada-pengiriman">
+							<p>Tidak ada pengiriman baru</p>
+						</div>
+						<div class="form-group" id="form-tb-paket">
+							<table id="tb-paket" class="table table-striped table-bordered display" style="width:100%">
+
+							</table>
+						</div>
+					</div>
+				</div>
+			</div>
+			<footer class="footer">
+				<ul class="list-inline">
+					<li>Arifuddin Naawi Amanah © 2025.</li>
+					<!-- <li><a href="#">Privacy</a></li>
+				<li><a href="#">Terms</a></li>
+				<li><a href="#">Help</a></li> -->
+				</ul>
+			</footer>
+		</div>
+		<!-- /.main-content -->
+	</div><!--/#wrapper -->
+
+	<div class="modal fade" id="modal-paket" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-paket-title">Modal title</h4>
+				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-paket" style="display: none">
+							<center>
+								<div id="preview-gambar-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-paket">
+						<!-- create upload -->
+						<label for="modal-paket-nama">Photo Paket</label>
+						<input type="file" class="form-control" id="gambar-paket" accept="image/*"
+							onchange="showUpload(this, 'gambar-paket')">
+					</div>
+
+					<div class="form-group" id="div-nomor-resi" style="display: none">
+						<label for="modal-paket-nomor-resi">Nomor Resi</label>
+						<input type="text" class="form-control" id="nomor_resi">
+					</div>
+
+					<div class="form-group" id="div-nomor-pengguna">
+						<label for="modal-paket-pengguna">Pengguna</label>
+						<input type="text" class="form-control" id="pengguna">
+					</div>
+
+					<div class="form-group" id="div-waktu-dibuat" style="display: none">
+						<label for="modal-paket-waktu-dibuat">Waktu Dibuat</label>
+						<input type="text" class="form-control" id="waktu_dibuat">
+					</div>
+
+					<div class="form-group" id="div-status" style="display: none">
+						<label for="modal-paket-div-status">Status</label>
+						<input type="text" class="form-control" id="status">
+					</div>
+
+					<hr>
+					<hr>
+
+
+					<div class="form-group">
+						<label for="modal-paket-nama-pengirim">Nama Pengirim</label>
+						<input type="text" class="form-control" id="nama_pengirim" placeholder="Masukkan Nama Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-pengirim">No Telpon/HP Pengirim</label>
+						<input type="text" class="form-control" id="no_telpon_pengirim" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-pengirim">Alamat Pengirim</label>
+						<textarea name="alamat_pengirim" class="form-control" id="alamat_pengirim"
+							placeholder="Masukkan Alamat Pengirim" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-nama-penerima">Nama Penerima</label>
+						<input type="text" class="form-control" id="nama_penerima" placeholder="Masukkan Nama Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-penerima">No Telpon/HP Penerima</label>
+						<input type="text" class="form-control" id="no_telpon_penerima" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-penerima">Alamat Penerima</label>
+						<textarea name="alamat_penerima" class="form-control" id="alamat_penerima"
+							placeholder="Masukkan Alamat Penerima" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-berat">Kurir Yang Ditugaskan</label>
+						<input type="text" class="form-control" id="input_kurir" style="display: none">
+					</div>
+
+					<hr>
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-foto-paket" style="display: none">
+							<center>
+								<div id="preview-foto-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-foto-paket">
+						<!-- create upload -->
+						<label id="modal-paket-fotonya">Photo Paket</label>
+						<input type="file" class="form-control" id="foto-paket" accept="image/*"
+							onchange="showUpload(this, 'foto-paket')">
+					</div>
+					<hr>
+
+
+					<div class="form-group">
+						<label for="modal-paket-berat">Progress</label>
+						<div class="activity-list">
+						</div>
+					</div>
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-xs btn-default btn-sm waves-effect waves-light"
+						data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-xs btn-danger btn-sm waves-effect waves-light"
+						id="btn-batalkan-paket">Batalkan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-primary btn-sm waves-effect waves-light"
+						id="btn-mengambil-paket">Berangkat Mengambil Paket</button>
+
+				</div>
+			</div>
+		</div>
+	</div>
+
+	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+	<!--[if lt IE 9]>
+		<script src="/script/html5shiv.min.js"></script>
+		<script src="/script/respond.min.js"></script>
+	<![endif]-->
+	<!-- 
+	================================================== -->
+	<!-- Placed at the end of the document so the pages load faster -->
+	<script src="/scripts/jquery.min.js"></script>
+	<script src="/scripts/modernizr.min.js"></script>
+	<script src="/plugin/bootstrap/js/bootstrap.min.js"></script>
+	<script src="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+	<script src="/plugin/nprogress/nprogress.js"></script>
+	<script src="/plugin/sweet-alert/sweetalert.min.js"></script>
+	<script src="/plugin/waves/waves.min.js"></script>
+	<!-- Full Screen Plugin -->
+	<script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
+
+	<!-- Toastr -->
+	<script src="/plugin/toastr/toastr.min.js"></script>
+
+	<script src="/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
+	<script src="/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
+	<script src="/plugin/datatables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
+
+	<script src="/block/jquery.blockUI.js"></script>
+
+	<script src="/scripts/main.min.js"></script>
+	<script src="/my-js.js"></script>
+	<script src="/socket-io/client-dist/socket.io.js"></script>
+	<script>
+		const global_data = JSON.parse(localStorage.getItem('user'));
+		var global_detail_paket;
+	</script>
+	<script src="/kurir.js"></script>
+
+	<script>
+		function reloadTable() {
+			// destroy table
+			// $('#tb-kurir').DataTable().destroy();
+			$('#tb-paket').DataTable({
+				// responsive: true,
+				scrollX: true,
+				// order: [
+				// 	[0, 'asc']
+				// ],
+				ajax: {
+					url: '/kurir/paket/' + global_data._id + '/ongoing',
+					type: 'GET',
+					timeout: 120000,
+					dataSrc: function (data) {
+						console.log(data)
+						if (data.length == 0) {
+							$("#form-tb-paket").hide();
+							$("#text-tiada-pengiriman").show();
+						} else {
+							$("#form-tb-paket").show();
+							$("#text-tiada-pengiriman").hide();
+						}
+						return data.reverse();
+					}
+				},
+				"sAjaxDataProp": "",
+				"aoColumns": [
+					// {
+					// 	"mData": "_id",
+					// 	"title": "No Resi",
+					// 	"render": function (data, type, row) {
+					// 		return data
+					// 	}
+					// },
+					{
+						"mData": "nama_pengirim",
+						"title": "Nama Pengirim",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "nama_penerima",
+						"title": "Nama Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "alamat_penerima",
+						"title": "Alamat Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "status",
+						"title": "Status",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": null,
+						"title": "Aksi",
+						"render": function (data, type, row) {
+							return `<button type='button' onclick='open_modal_paket("${data._id}")' title='Detail Pengiriman' class='btn btn-info btn-circle btn-sm waves-effect waves-light'><i class='ico zmdi zmdi-info'></i></button> `
+						}
+					}
+				]
+
+			})
+
+
+		}
+
+		reloadTable()
+
+		function showUpload(element, stat) {
+			console.log(element.files);
+			console.log(stat);
+			var file = element.files[0];
+
+			if (file) {
+				var reader = new FileReader();
+				reader.onload = function (event) {
+					var imageUrl = event.target.result;
+
+					// Create an image element
+					var img = document.createElement('img');
+					img.src = imageUrl;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					const id = 'show-upload-' + stat
+
+					const id_preview = 'preview-' + stat
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+				}
+				reader.readAsDataURL(file);
+			}
+		}
+
+	</script>
+
+	<script>
+		async function open_modal_paket(id) {
+			$.ajax({
+				url: '/user/paket-detail/' + id,
+				type: 'GET',
+				timeout: 20000,
+				beforeSend: function () {
+					blockUI('Loading Data...');
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+				success: function (data) {
+					// Handle the response here
+					console.log(data.timeline);
+
+					if (data.id_kurir != null && data.id_kurir != undefined && data.id_kurir != "") {
+						// // hide select kurir
+						// $("#div-select-kurir").hide();
+						// // show input_kurir
+						$("#input_kurir").show();
+						$("#input_kurir").val(global_data.nama);
+
+						// // hide batal button
+						// $("#btn-batalkan-paket").hide();
+
+						// // hide btn-tugaskan-kurir
+						// $("#btn-tugaskan-kurir").hide();
+					} else {
+						// // show select kurir
+						// $("#div-select-kurir").show();
+						// // hide input_kurir
+						$("#input_kurir").hide();
+						// show batal button
+						// $("#btn-batalkan-paket").show();
+
+						// // show btn-tugaskan-kurir
+						// $("#btn-tugaskan-kurir").show();
+					}
+
+					// let waktu_dibuat = new Date(data.createdAt);
+
+					$("#show-upload-foto-paket").hide();
+					$("#foto-paket").val("");
+
+					const userData = $.ajax({
+						url: '/kurir/user/' + data.id_pengirim,
+						type: 'GET',
+						timeout: 20000,
+						async: false
+					}).responseJSON;
+
+					// console.log(userData);
+
+					$("#pengguna").val(userData.nama);
+
+					$('#modal-paket-title').html('Form Detail Pengiriman Paket');
+
+					// $("#id").val(data._id);
+					$("#div-nomor-resi").show();
+					$("#nomor_resi").val(data._id);
+					$("#div-waktu-dibuat").show();
+					$("#waktu_dibuat").val(formatToMakassar(data.createdAt));
+					$("#div-status").show();
+					$("#status").val(data.status);
+					$("#no_telpon_pengirim").val(data.no_telpon_pengirim);
+					$("#nama_pengirim").val(data.nama_pengirim);
+					$("#alamat_pengirim").val(data.alamat_pengirim);
+					$("#no_telpon_penerima").val(data.no_telpon_penerima);
+					$("#nama_penerima").val(data.nama_penerima);
+					$("#alamat_penerima").val(data.alamat_penerima);
+					// $("#gambar-paket").attr("src", data.gambar_paket);
+
+					var img = document.createElement('img');
+					img.src = "/user/paket-detail/" + data._id + "/" + data.gambar_paket;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
+
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					// disable all input in #form-modal
+					$("#form-gambar-paket").hide();
+
+					$('#form-modal :input').prop('disabled', true);
+
+					// make select enabled
+					$("#select-kurir").prop('disabled', false);
+
+
+					let activity_html = '';
+					for (let i = data.timeline.length - 1; i >= 0; i--) {
+						let colornya = 'bg-info';
+
+						if (data.timeline[i].status == 'Paket Telah Diterima Penerima') {
+							colornya = 'bg-success';
+						}
+
+						if (data.timeline[i].status.includes('Dibatalkan')) {
+							colornya = 'bg-danger';
+						}
+
+						activity_html += `<div class="activity-item">
+							<div class="bar ${colornya}">
+							<div class="dot ${colornya}"></div>
+							</div>
+							<div class="content">
+							<div class="date">${formatToMakassar(data.timeline[i].waktu)}</div>
+							<div class="text">
+								${data.timeline[i].status}
+								${!data.timeline[i].gambar ? "" : `<br><img src="/kurir/gambar-paket/${data._id}/${data.timeline[i].gambar}" width="100px" height="100px">`} 
+							</div>
+							</div>
+						</div>`;
+					}
+
+					$('.activity-list').html(activity_html);
+
+					// sign a onclick on #btn-batalkan-paket
+					$('#btn-batalkan-paket').hide();
+					// if data.status == "Kurir Telah Ditugaskan"
+					if (data.status == "Kurir Telah Ditugaskan") {
+						$('#btn-batalkan-paket').attr('onclick', `batalkan_pengiriman('${data._id}')`);
+						$('#btn-batalkan-paket').show();
+					}
+
+
+
+					global_detail_paket = data;
+					// sign a onclick on #btn-tugaskan-kurir
+					const nama_function = data.status == "Kurir Telah Ditugaskan" ? `mengambil_paket('${data._id}')` : data.status == "Kurir Dalam Perjalanan" ? `foto_paket_lokasi_pengirim('${data._id}','mengirim')` : data.status == "Mengirim Paket Ke Alamat Penerima" ? `foto_paket_lokasi_pengirim('${data._id}','menerima')` : null
+
+					const ket_function = data.status == "Kurir Telah Ditugaskan" ? "Mengambil Paket" : data.status == "Kurir Dalam Perjalanan" ? "Hantar Paket Ke Lokasi Penerima" : data.status == "Mengirim Paket Ke Alamat Penerima" ? "Paket Diterima Oleh Penerima" : null
+
+					console.log(nama_function);
+
+					$('#btn-mengambil-paket').attr('onclick', nama_function);
+					$('#btn-mengambil-paket').html(ket_function);
+
+					if (data.status == "Kurir Dalam Perjalanan" || data.status == "Mengirim Paket Ke Alamat Penerima") {
+						$("#form-foto-paket").show();
+						// $("#show-upload-foto-paket").show();
+						// enable foto-paket
+						$("#foto-paket").prop('disabled', false);
+						$("#modal-paket-fotonya").html("Foto Paket Pengiriman");
+					}
+
+					if (data.status == "Kurir Telah Ditugaskan" || data.status == "'Menunggu Admin Memproses") {
+						// enable foto-paket
+						$("#form-foto-paket").hide();
+						$("#show-upload-foto-paket").hide();
+					}
+
+					$('#modal-paket').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+				},
+				error: function (xhr, status, error) {
+					console.error('AJAX error:', error);
+				}
+			});
+		}
+
+
+		function batalkan_pengiriman(id) {
+			// Hide the modal first
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "",
+				text: "Silakan tulis alasan pembatalan:",
+				type: "input",
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				inputPlaceholder: "Contoh: Ada Urusan Lain",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					$('#modal-paket').modal('show');
+					return false;
+				}
+				if (inputValue === "") {
+					swal("Oops!", "Alasan tidak boleh kosong!", "error");
+					// open the modal again
+					$('#modal-paket').modal('show');
+					return false;
+				}
+
+				// close the swal
+				swal.close();
+				console.log(inputValue);
+
+				$.ajax({
+					url: '/kurir/batalkan-pengiriman/' + global_data._id,
+					type: 'DELETE',
+					data: {
+						id: id,
+						alasan: inputValue
+					},
+					beforeSend: function () {
+						blockUI("Melakukan Pembatalan Pengiriman...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data);
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// // destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						// // $.unblockUI();
+						swal({
+							title: "Berhasil!",
+							text: "Pengiriman Berhasil Dibatalkan",
+							type: "success",
+							timer: 2000, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				});
+			});
+
+
+
+
+
+		}
+
+
+
+		function mengambil_paket(id) {
+			console.log(id);
+			// console.log(global_detail_paket);
+			// Hide the modal first
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "Mengambil Paket",
+				type: "info",
+				text: "Alamat : <b><i>" + global_detail_paket.alamat_pengirim + "</></b><br>Nama Pengirim :<i><b>" + global_detail_paket.nama_pengirim + "</b></i>",
+				html: true,
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					$('#modal-paket').modal('show');
+					return false;
+				}
+
+				swal.close();
+
+				$.ajax({
+					url: '/kurir/mengambil-pengiriman/' + id,
+					type: 'PUT',
+					data: {
+						id_kurir: global_data._id
+					},
+					beforeSend: function () {
+						blockUI("Mengambil Paket...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data);
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// // destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						// // $.unblockUI();
+						swal({
+							title: "Berhasil!",
+							text: "Status Pengiriman Berhasil Diubah,\nAnda Sekarang Dalam Perjalanan Mengambil Paket Dari Pengirim",
+							type: "success",
+							timer: 3500, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				});
+
+				// swal({
+				// 	title: "Berhasil!",
+				// 	text: "Status Pengiriman Berhasil Diubah,\nAnda Sekarang Mengambil Paket",
+				// 	type: "success",
+				// 	timer: 2000, // time in milliseconds (2000ms = 2 seconds)
+				// 	showConfirmButton: false
+				// });
+			})
+		}
+
+
+
+
+		function foto_paket_lokasi_pengirim(id, stat) {
+			// Hide the modal first
+			// $('#modal-paket').modal('hide');
+
+			// console.log(id);
+			const foto_paket = $('#foto-paket').val();
+
+			if (foto_paket == "") {
+				toastr.error("Foto Paket Tidak Boleh Kosong");
+				$('#foto-paket').focus();
+				return;
+			}
+
+			let formdata = new FormData();
+			formdata.append('foto_paket', $('#foto-paket')[0].files[0]);
+			// formdata.append('id_paket', id);
+			formdata.append('id_kurir', global_data._id);
+			formdata.append('status', stat);
+
+			$('#modal-paket').modal('hide');
+
+
+			swal({
+				title: stat == "mengirim" ? "Hantar Paket Ke Alamat Penerima" : "Paket Diterima Oleh Penerima",
+				type: stat == "mengirim" ? "info" : "success",
+				text: stat == "mengirim" ? "Alamat : <b><i>" + global_detail_paket.alamat_penerima + "</></b><br>Nama Penerima :<i><b>" + global_detail_paket.nama_penerima + "</b></i><br>No Telpon/HP Penerima :<i><b>" + global_detail_paket.no_telpon_penerima + "</b></i>" : "",
+				html: true,
+				showCancelButton: true,
+				closeOnConfirm: false,
+				animation: "slide-from-top",
+				confirmButtonColor: "#304ffe"
+			}, function (inputValue) {
+				if (inputValue === false) {
+					console.log('cancel');
+					$('#modal-paket').modal('show');
+					return false;
+				}
+				// $('#modal-paket').modal('show');
+				// return false;
+
+				swal.close();
+
+				$.ajax({
+					url: '/kurir/mengambil-pengiriman-dari-pengirim-ke-penerima/' + id,
+					type: 'POST',
+					data: formdata,
+					processData: false,
+					contentType: false,
+					beforeSend: function () {
+						blockUI("Mengirim Paket...");
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data);
+						// Hide the modal
+						$('#modal-paket').modal('hide');
+						// // destroy table
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						swal({
+							title: "Berhasil!",
+							text: stat == "mengirim" ? "Status Pengiriman Berhasil Diubah,\nAnda Sekarang Mengirim Paket Ke Alamat Penerima Di <b>" + global_detail_paket.alamat_penerima + "</b>" : "Paket Telah Diterima Oleh Penerima",
+							html: true,
+							type: "success",
+							timer: 3000, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+
+
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+						$('#modal-paket').modal('show');
+					}
+				});
+			});
+
+
+		}
+
+	</script>
+
+</body>
+
+</html>

routes/user_after_login_ui/history.html

@@ -0,0 +1,994 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+	<meta name="description" content="">
+	<meta name="author" content="">
+
+	<title>Shenior paket | History Pengiriman</title>
+
+	<!-- Main Styles -->
+	<link rel="stylesheet" href="/styles/style.min.css">
+
+	<!-- mCustomScrollbar -->
+	<link rel="stylesheet" href="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
+
+	<!-- Waves Effect -->
+	<link rel="stylesheet" href="/plugin/waves/waves.min.css">
+
+	<!-- Sweet Alert -->
+	<link rel="stylesheet" href="/plugin/sweet-alert/sweetalert.css">
+
+	<link rel="stylesheet" href="/fonts/fontello/fontello.css">
+
+	<link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
+	<link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
+
+	<link rel="stylesheet" href="/plugin/datatables/media/css/dataTables.bootstrap.min.css">
+
+	<!-- Toastr -->
+	<link rel="stylesheet" href="/plugin/toastr/toastr.css">
+	<script src="/auth.js"></script>
+</head>
+
+<body>
+	<div class="main-menu">
+		<header class="header">
+			<a href="/admin" class="logo">Shenior paket</a>
+			<button type="button" class="button-close fa fa-times js__menu_close"></button>
+			<div class="user">
+				<a href="#" class="avatar"><img src="/images/person.png" id="img-avatar" alt=""
+						style="width: 65px; height: 65px;"><span class="status online"></span></a>
+				<h5 class="name"><a href="#" id="h5-title">...</a></h5>
+				<h5 class="position">Pengguna</h5>
+
+			</div>
+			<!-- /.user -->
+		</header>
+		<!-- /.header -->
+		<div class="content">
+
+			<div class="navigation">
+				<h5 class="title">Navigasi</h5>
+				<!-- /.title -->
+				<ul class="menu js__accordion">
+					<li>
+						<a class="waves-effect" href="/user"><i class="menu-icon fa fa-home"></i><span>Halaman
+								Utama</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/user/kirim-paket"><i
+								class="menu-icon ico mdi mdi-motorbike"></i><span>Pengiriman Paket</span></a>
+					</li>
+
+					<li  class="current active">
+						<a class="waves-effect" href="/user/history" ><i
+								class="menu-icon ico icon-table"></i><span>History Pengiriman</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/user/profil"><i class="menu-icon ico icon-user"></i><span>Profil
+								Pengunna</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" onclick="logout()" href="#"><i
+								class="menu-icon ico icon-logout"></i><span>Logout</span></a>
+					</li>
+				</ul>
+
+			</div>
+			<!-- /.navigation -->
+		</div>
+		<!-- /.content -->
+	</div>
+	<!-- /.main-menu -->
+
+	<div class="fixed-navbar">
+		<div class="pull-left">
+			<button type="button"
+				class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
+			<h1 class="page-title">History Pengiriman</h1>
+			<!-- /.page-title -->
+		</div>
+		<!-- /.pull-left -->
+		<div class="pull-right">
+
+
+			<a href="#" class="ico-item ico icon-logout" onclick="logout()"></a>
+		</div>
+		<!-- /.pull-right -->
+	</div>
+	<!-- /.fixed-navbar -->
+
+	<div id="wrapper">
+		<div class="main-content">
+			<div class="row small-spacing">
+				<div class="col-xs-12">
+					<div class="box-content card">
+						<h4 class="box-title">Form History Pengiriman</h4>
+						<!-- /.box-title -->
+						<div class="card-content">
+							<!-- <div class="form-group">
+								<button type="button" class="btn btn-sm btn-info btn-rounded waves-effect waves-light"
+									onclick="addpaketOpenModal()">Pendaftaran Pengiriman Baru</button>
+							</div> -->
+
+							<div class="form-group text-center" id="text-tiada-pengiriman">
+								<p>Tidak ada history pengiriman</p>
+							</div>
+							<div class="form-group" id="form-tb-paket">
+								<table id="tb-paket" class="table table-striped table-bordered display"
+									style="width:100%">
+
+								</table>
+							</div>
+						</div>
+					</div>
+					<!-- /.box-content -->
+				</div>
+
+
+
+			</div>
+			<footer class="footer">
+				<ul class="list-inline">
+					<li>Arifuddin Naawi Amanah © 2025.</li>
+					<!-- <li><a href="#">Privacy</a></li>
+				<li><a href="#">Terms</a></li>
+				<li><a href="#">Help</a></li> -->
+				</ul>
+			</footer>
+		</div>
+		<!-- /.main-content -->
+	</div><!--/#wrapper -->
+
+	<div class="modal fade" id="modal-paket" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-paket-title">Modal title</h4>
+				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-paket" style="display: none">
+							<center>
+								<div id="preview-gambar-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-paket">
+						<!-- create upload -->
+						<label for="modal-paket-nama">Photo Paket</label>
+						<input type="file" class="form-control" id="gambar-paket" accept="image/*"
+							onchange="showUpload(this, 'gambar-paket')">
+					</div>
+
+					<div class="form-group" id="div-nomor-resi" style="display: none">
+						<label for="modal-paket-nomor-resi">Nomor Resi</label>
+						<input type="text" class="form-control" id="nomor_resi">
+					</div>
+
+					<div class="form-group" id="div-waktu-dibuat" style="display: none">
+						<label for="modal-paket-waktu-dibuat">Waktu Dibuat</label>
+						<input type="text" class="form-control" id="waktu_dibuat">
+					</div>
+
+					<div class="form-group" id="div-status" style="display: none">
+						<label for="modal-paket-div-status">Status</label>
+						<input type="text" class="form-control" id="status">
+					</div>
+
+
+					<div class="form-group">
+						<label for="modal-paket-nama-pengirim">Nama Pengirim</label>
+						<input type="text" class="form-control" id="nama_pengirim" placeholder="Masukkan Nama Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-pengirim">No Telpon/HP Pengirim</label>
+						<input type="text" class="form-control" id="no_telpon_pengirim" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-pengirim">Alamat Pengirim</label>
+						<textarea name="alamat_pengirim" class="form-control" id="alamat_pengirim"
+							placeholder="Masukkan Alamat Pengirim" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-nama-penerima">Nama Penerima</label>
+						<input type="text" class="form-control" id="nama_penerima" placeholder="Masukkan Nama Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-penerima">No Telpon/HP Penerima</label>
+						<input type="text" class="form-control" id="no_telpon_penerima" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-penerima">Alamat Penerima</label>
+						<textarea name="alamat_penerima" class="form-control" id="alamat_penerima"
+							placeholder="Masukkan Alamat Penerima" style="resize: none;"></textarea>
+					</div>
+
+					<!-- ini dibawah untuk div tamnpilkan progress -->
+					<div id="div-form-progress">
+						<hr>
+
+						<div class="form-group" id="div-data-kurir">
+							<!-- create underline on <i> -->
+							<label for="modal-paket-berat">Kurir Yang Ditugaskan <i
+									style="text-decoration: underline;color: blue">(Klik Untuk Melihat Info
+									Kurir)</i></label>
+							<input type="text" class="form-control" id="input_kurir">
+						</div>
+
+						<hr>
+
+
+						<div class="form-group">
+							<label for="modal-paket-berat">Progress</label>
+							<div class="activity-list">
+							</div>
+						</div>
+					</div>
+					<!-- akhir div tampilan progress -->
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default btn-sm waves-effect waves-light"
+						data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="btn-pengiriman"
+						onclick="tambahpengiriman()">Lakukan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-danger btn-sm waves-effect waves-light"
+						id="btn-batalkan-paket">Batalkan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-success btn-sm waves-effect waves-light"
+						id="btn-terima-paket">Paket Diterima</button>
+
+				</div>
+			</div>
+		</div>
+	</div>
+
+	<div class="modal fade" id="modal-kurir" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-kurir-title">Modal title</h4>
+				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-kurir" style="display: none">
+							<center>
+								<div id="preview-gambar-kurir" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-kurir">
+						<!-- create upload -->
+						<label for="modal-kurir-nama">Photo Kurir</label>
+						<input type="file" class="form-control" id="gambar-kurir" accept="image/*"
+							onchange="showUpload(this, 'gambar-kurir')">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-kurir-nama">Nama</label>
+						<input type="text" class="form-control" id="nama-kurir" placeholder="Masukkan Nama">
+					</div>
+					<div class="form-group">
+						<label for="modal-kurir-nama">No Telpon/HP</label>
+						<input type="text" class="form-control" id="no_telpon-kurir" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-kurir-nama">Jenis Kelamin</label>
+						<select class="form-control" id="jenis-kelamin-kurir">
+							<option value="" disabled selected>-Pilih Jenis Kelamin</option>
+							<option value="Laki-laki">Laki-laki</option>
+							<option value="Perempuan">Perempuan</option>
+						</select>
+					</div>
+					<hr>
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-motor" style="display: none">
+							<center>
+								<div id="preview-gambar-motor" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-motor">
+						<!-- create upload -->
+						<label for="modal-kurir-nama">Photo Motor</label>
+						<input type="file" class="form-control" id="gambar-motor" accept="image/*"
+							onchange="showUpload(this, 'gambar-motor')">
+					</div>
+					<div class="form-group">
+						<label for="modal-kurir-dd-motor">DD Motor</label>
+						<input type="text" class="form-control" id="dd-motor-kurir" placeholder="Masukkan DD Motor">
+					</div>
+
+
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default btn-sm waves-effect waves-light"
+						id="button-close-modal-kurir">Close</button>
+				</div>
+			</div>
+		</div>
+	</div>
+	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+	<!--[if lt IE 9]>
+		<script src="/script/html5shiv.min.js"></script>
+		<script src="/script/respond.min.js"></script>
+	<![endif]-->
+	<!-- 
+	================================================== -->
+	<!-- Placed at the end of the document so the pages load faster -->
+	<script src="/scripts/jquery.min.js"></script>
+	<script src="/scripts/modernizr.min.js"></script>
+	<script src="/plugin/bootstrap/js/bootstrap.min.js"></script>
+	<script src="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+	<script src="/plugin/nprogress/nprogress.js"></script>
+	<script src="/plugin/sweet-alert/sweetalert.min.js"></script>
+	<script src="/plugin/waves/waves.min.js"></script>
+	<!-- Full Screen Plugin -->
+	<script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
+
+	<script src="/plugin/datatables/media/js/jquery.dataTables.min.js"></script>
+	<script src="/plugin/datatables/media/js/dataTables.bootstrap.min.js"></script>
+	<script src="/plugin/datatables/extensions/Responsive/js/dataTables.responsive.min.js"></script>
+
+	<!-- Toastr -->
+	<script src="/plugin/toastr/toastr.min.js"></script>
+
+	<script src="/block/jquery.blockUI.js"></script>
+	<script src="/socket-io/client-dist/socket.io.js"></script>
+
+	<script src="/scripts/main.min.js"></script>
+
+	<script src="/my-js.js"></script>
+
+
+	<script>
+		function showUpload(element) {
+			var file = element.files[0];
+
+			if (file) {
+				var reader = new FileReader();
+				reader.onload = function (event) {
+					var imageUrl = event.target.result;
+
+					// Create an image element
+					var img = document.createElement('img');
+					img.src = imageUrl;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
+
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+				}
+				reader.readAsDataURL(file);
+			}
+		}
+
+
+	</script>
+	<script>
+		const global_data = JSON.parse(localStorage.getItem('user'));
+		document.getElementById('h5-title').innerHTML = global_data.nama;
+		$("#no_telpon_pengirim").val(global_data.no_telpon);
+		$("#nama_pengirim").val(global_data.nama);
+		$("#alamat_pengirim").val(global_data.alamat);
+		$("#img-avatar").attr("src", global_data.gambar == null || global_data.gambar == "" ? "/images/person.png" : "/user/gambar/" + global_data._id + "/" + global_data.gambar);
+
+		function reloadTable() {
+			// destroy table
+			// $('#tb-kurir').DataTable().destroy();
+			$('#tb-paket').DataTable({
+				// responsive: true,
+				scrollX: true,
+				// order: [
+				// 	[0, 'asc']
+				// ],
+				ajax: {
+					url: '/user/paket/' + global_data._id + '/all',
+					type: 'GET',
+					timeout: 120000,
+					dataSrc: function (data) {
+						// console.log(data)
+						if (data.length == 0) {
+							$("#form-tb-paket").hide();
+							$("#text-tiada-pengiriman").show();
+						} else {
+							$("#form-tb-paket").show();
+							$("#text-tiada-pengiriman").hide();
+						}
+						return data.reverse();
+					}
+				},
+				"sAjaxDataProp": "",
+				"aoColumns": [
+					// {
+					// 	"mData": "_id",
+					// 	"title": "No Resi",
+					// 	"render": function (data, type, row) {
+					// 		return data
+					// 	}
+					// },
+					{
+						"mData": "nama_pengirim",
+						"title": "Nama Pengirim",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "nama_penerima",
+						"title": "Nama Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "alamat_penerima",
+						"title": "Alamat Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "status",
+						"title": "Status",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": null,
+						"title": "Aksi",
+						"render": function (data, type, row) {
+							let html = '';
+							if (data.status == "Menunggu Admin Memproses") {
+								html = `<button type='button' onclick='deletepaket("${data._id}")' title='Batalkan Pengiriman' class='btn btn-danger btn-circle btn-sm waves-effect waves-light'><i class='ico icon-cancel-circled'></i></button>`;
+							}
+							return `<button type='button' onclick='open_modal_paket("${data._id}")' title='Detail Pengiriman' class='btn btn-info btn-circle btn-sm waves-effect waves-light'><i class='ico zmdi zmdi-info'></i></button> ${html}`
+						}
+					}
+				]
+
+			})
+
+
+		}
+
+		reloadTable()
+
+	</script>
+	<script src="/user.js"></script>
+
+	<script>
+		function addpaketOpenModal() {
+			$("#btn-pengiriman").show();
+			$("#btn-batalkan-paket").hide();
+			$("#div-form-progress").hide();
+			$("#btn-terima-paket").hide();
+			$('#modal-paket-title').html('Form Pengiriman Paket Baru');
+			$("#div-nomor-resi").hide();
+			$("#div-waktu-dibuat").hide();
+			$("#div-status").hide();
+			$("#nama_pengirim").val(global_data.nama);
+			$("#no_telpon_pengirim").val(global_data.no_telpon);
+			$("#alamat_pengirim").val(global_data.alamat);
+			$("#nama_penerima").val("");
+			$("#no_telpon_penerima").val("");
+			$("#alamat_penerima").val("");
+			$("#show-upload-gambar-paket").hide();
+			$("#gambar-paket").val('');
+			$('#form-modal :input').prop('disabled', false);
+			$('#modal-paket').modal({
+				backdrop: 'static',
+				keyboard: false  // Optional: prevents closing via Esc key
+			});
+		}
+		function tambahpengiriman() {
+			if ($("#gambar-paket")[0].files.length == 0) {
+				toastr.error("Foto Pengiriman Tidak Boleh Kosong");
+				// focus to input
+				$("#gambar-paket").focus();
+				return;
+			}
+			if ($("#nama_pengirim").val() == "") {
+				toastr.error("Nama Pengirim Tidak Boleh Kosong");
+				// focus to input
+				$("#nama_pengirim").focus();
+				return;
+			}
+
+			if ($("#no_telpon_pengirim").val() == "") {
+				toastr.error("No Telpon Pengirim Tidak Boleh Kosong");
+				// focus to input
+				$("#no_telpon_pengirim").focus();
+				return;
+			}
+
+			if ($("#alamat_pengirim").val() == "") {
+				toastr.error("Alamat Pengirim Tidak Boleh Kosong");
+				// focus to input
+				$("#alamat_pengirim").focus();
+				return;
+			}
+
+			if ($("#nama_penerima").val() == "") {
+				toastr.error("Nama Penerima Tidak Boleh Kosong");
+				// focus to input
+				$("#nama_penerima").focus();
+				return;
+			}
+
+			if ($("#no_telpon_penerima").val() == "") {
+				toastr.error("No Telpon Penerima Tidak Boleh Kosong");
+				// focus to input
+				$("#no_telpon_penerima").focus();
+				return;
+			}
+
+			if ($("#alamat_penerima").val() == "") {
+				toastr.error("Alamat Penerima Tidak Boleh Kosong");
+				// focus to input
+				$("#alamat_penerima").focus();
+				return;
+			}
+
+
+			swal({
+				title: "Yakin?",
+				text: "Anda yakin ingin mengirim paket?",
+				icon: "info",
+				showCancelButton: !0,
+				// confirmButtonColor: "#DD6B55",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+			}, function (y) {
+				if (y) {
+					let form_data = new FormData();
+					form_data.append('_id', global_data._id);
+					form_data.append('no_telpon_pengirim', $("#no_telpon_pengirim").val());
+					form_data.append('nama_pengirim', $("#nama_pengirim").val());
+					form_data.append('alamat_pengirim', $("#alamat_pengirim").val());
+					form_data.append('nama_penerima', $("#nama_penerima").val());
+					form_data.append('no_telpon_penerima', $("#no_telpon_penerima").val());
+					form_data.append('alamat_penerima', $("#alamat_penerima").val());
+					form_data.append('gambar_paket', $("#gambar-paket")[0].files[0]);
+
+					$.ajax({
+						url: '/user/kirim-paket/',
+						type: 'POST',
+						data: form_data,
+						contentType: false,
+						processData: false,
+						beforeSend: function () {
+							$('#modal-paket').modal('hide');
+							blockUI('Melakukan Permintaan Pengiriman Paket...');
+						},
+
+						complete: () => {
+							// console.log(data);
+
+							$.unblockUI();
+						},
+						success: (data) => {
+							console.log(data);
+							toastr.options.timeOut = 2500; // 2.5 seconds
+							toastr.success('Permintaan Pengiriman Paket Berhasil<br>Menunggu Admin Menyetujui');
+							$('#modal-paket').modal('hide');
+							// destroy table
+							$('#tb-paket').DataTable().destroy();
+							reloadTable();
+							// $.unblockUI();
+						},
+						// location.reload();
+						error: (xhr, status, error) => {
+							$('#modal-paket').modal('show');
+							console.log(xhr.responseJSON);
+							toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+							// $.unblockUI();
+						}
+					});
+
+				}
+			});
+
+
+
+		}
+
+		async function open_modal_paket(id) {
+			$("#btn-terima-paket").hide();
+			$("#div-form-progress").show();
+			$.ajax({
+				url: '/user/paket-detail/' + id,
+				type: 'GET',
+				timeout: 20000,
+				beforeSend: function () {
+					blockUI('Loading Data...');
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+				success: function (data) {
+					// Handle the response here
+
+					// let waktu_dibuat = new Date(data.createdAt);
+
+					$('#modal-paket-title').html('Form Detail Pengiriman Paket');
+
+					$("#btn-pengiriman").hide();
+					$("#btn-batalkan-paket").hide();
+					if (data.status == "Menunggu Admin Memproses") {
+						$("#btn-batalkan-paket").show();
+						// add onclick deletepaket(data._id);
+						$("#btn-batalkan-paket").attr('onclick', 'deletepaket("' + data._id + '")');
+					}
+
+					// $("#id").val(data._id);
+					$("#div-nomor-resi").show();
+					$("#nomor_resi").val(data._id);
+					$("#div-waktu-dibuat").show();
+					$("#waktu_dibuat").val(formatToMakassar(data.createdAt));
+					$("#div-status").show();
+					$("#status").val(data.status);
+					$("#no_telpon_pengirim").val(data.no_telpon_pengirim);
+					$("#nama_pengirim").val(data.nama_pengirim);
+					$("#alamat_pengirim").val(data.alamat_pengirim);
+					$("#no_telpon_penerima").val(data.no_telpon_penerima);
+					$("#nama_penerima").val(data.nama_penerima);
+					$("#alamat_penerima").val(data.alamat_penerima);
+					// $("#gambar-paket").attr("src", data.gambar_paket);
+
+					var img = document.createElement('img');
+					img.src = "/user/paket-detail/" + data._id + "/" + data.gambar_paket;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
+
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					// disable all input in #form-modal
+					$("#form-gambar-paket").hide();
+
+					$('#form-modal :input').prop('disabled', true);
+
+					// tampilkan data kurir
+					if (data.nama_kurir) {
+						$("#input_kurir").val(data.nama_kurir);
+						$("#div-data-kurir").attr("onclick", `liat_info_kurir('${data.id_kurir}', '${data._id}')`);
+						$("#div-data-kurir").show();
+					} else {
+						$("#div-data-kurir").hide();
+					}
+
+					let activity_html = '';
+					for (let i = data.timeline.length - 1; i >= 0; i--) {
+						let colornya = 'bg-info';
+
+						if (data.timeline[i].status == 'Paket Telah Diterima Penerima') {
+							colornya = 'bg-success';
+						}
+
+						if (data.timeline[i].status.includes('Dibatalkan')) {
+							colornya = 'bg-danger';
+						}
+
+						activity_html += `<div class="activity-item">
+							<div class="bar ${colornya}">
+							<div class="dot ${colornya}"></div>
+							</div>
+							<div class="content">
+							<div class="date">${formatToMakassar(data.timeline[i].waktu)}</div>
+							<div class="text">
+								${data.timeline[i].status}
+								${!data.timeline[i].gambar ? "" : `<br><img src="/kurir/gambar-paket/${data._id}/${data.timeline[i].gambar}" width="100px" height="100px">`} 
+							</div>
+							</div>
+						</div>`;
+					}
+
+					$('.activity-list').html(activity_html);
+
+					if (data.status == "Paket Telah Diterima Penerima") {
+						$("#btn-terima-paket").show();
+						$("#btn-terima-paket").attr("onclick", `terima_paket('${data._id}')`);
+					}
+
+					$('#modal-paket').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+				},
+				error: function (xhr, status, error) {
+					console.error('AJAX error:', error);
+				}
+			});
+
+
+
+
+			// console.log(id);
+
+		}
+
+
+		function liat_info_kurir(id_kurir, id) {
+			// close modal-paket 
+			$('#modal-paket').modal('hide');
+			console.log(id_kurir, id)
+			selectClicked = false
+
+			$("#button-close-modal-kurir").attr("onclick", `close_modal_kurir('${id}')`);
+			$.ajax({
+				type: 'GET',
+				url: '/user/cek-kurir/' + id_kurir,
+				dataType: 'json',
+				beforeSend: function () {
+					blockUI('Loading')
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+
+				success: function (data) {
+					console.log(data)
+					$('#modal-kurir-title').html('Detail Kurir')
+					// hide form-gambar div
+					$("#form-gambar-kurir").attr("hidden", true);
+					$("#form-gambar-motor").attr("hidden", true);
+					$("#no_telpon-kurir").val(data.no_telpon)
+					$("#nama-kurir").val(data.nama)
+					$("#jenis-kelamin-kurir").val(data.jenis_kelamin)
+					$("#dd-motor-kurir").val(data.dd_motor)
+					// disable all input in #form-modal
+
+					enableInput(true)
+
+					var img = document.createElement('img');
+					img.src = 'kurir/gambar/' + data.no_telpon + '/' + data.gambar_kurir;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					// Get the preview div
+					var previewDiv = document.getElementById('preview-gambar-kurir');
+					$('#show-upload-gambar-kurir').show();
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					var img = document.createElement('img');
+					img.src = 'kurir/gambar/' + data.no_telpon + '/' + data.gambar_motor;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					// Get the preview div
+					var previewDiv = document.getElementById('preview-gambar-motor');
+					$('#show-upload-gambar-motor').show();
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img)
+
+					$('#modal-kurir').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+
+				},
+				error: function (xhr, status, error) {
+					// console.error('AJAX error:', error);
+					// $('#modal-paket').modal('show');
+					console.log(xhr.responseJSON);
+					toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+				}
+			})
+
+
+
+		}
+
+		function close_modal_kurir(id) {
+			$('#modal-kurir').modal('hide');
+
+			// 1.5 sec then open modal
+			setTimeout(function () {
+				$('#modal-paket').modal('show');
+			}, 500);
+			// reloadTable(id);
+		}
+
+
+		function terima_paket(id) {
+			// close modal-paket
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "Apakah Anda Yakin?",
+				text: "Paket Telah Diterima",
+				type: "success",
+				showCancelButton: !0,
+				confirmButtonColor: "green",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+			}, function (willAccept) {
+				if (!willAccept) {
+					// show modal
+					$('#modal-paket').modal('show');
+					return;
+				}
+
+				swal.close();
+				// console.log(id)
+				$.ajax({
+					type: 'POST',
+					url: '/user/terima-paket/' + id,
+					data: {
+						id_pengirim: global_data._id,
+					},
+					dataType: 'json',
+					beforeSend: function () {
+						blockUI('Loading')
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data)
+						setTimeout(function () {
+							swal({
+								title: "Sukses",
+								text: "Anda Dapat Melihat Detail Pengiriman Pada Menu <br><b>History Pengiriman</b>",
+								html: true,
+								type: "success",
+								timer: 3500, // time in milliseconds (2000ms = 2 seconds)
+								showConfirmButton: false
+							});
+						}, 250);
+						// destroy modal
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				})
+
+				// setTimeout(function () {
+
+				// }, 250);
+
+			});
+
+		}
+
+		function deletepaket(id) {
+			// console.log(id)
+
+			const isOpen = $('#modal-paket').is(':visible');
+			if (isOpen) {
+				$('#modal-paket').modal('hide');
+			}
+			console.log(isOpen);
+			swal({
+				title: "Apakah Anda Yakin?",
+				text: "Anda Akan Membatal Pengiriman dengan No Resi <br><b>" + id + "</b>",
+				html: true,
+				type: "warning",
+				showCancelButton: !0,
+				confirmButtonColor: "red",
+				cancelButtonColor: "#d33",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+				closeOnConfirm: !1,
+				closeOnCancel: !1
+			}, function (willDelete) {
+				if (!willDelete) {
+					swal.close();
+					// show modal
+					if (isOpen) {
+						$('#modal-paket').modal('show');
+					}
+					
+					return;
+				}
+
+				swal.close();
+				// console.log(id)
+				$.ajax({
+					type: 'DELETE',
+					url: '/user/delete-paket/' + id,
+					data: {
+						id_pengirim: global_data._id,
+					},
+					dataType: 'json',
+					beforeSend: function () {
+						blockUI('Loading')
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data)
+						// destroy modal
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						swal({
+							title: "Sukses",
+							text: "Pengiriman Berhasil Dibatalkan, Anda Dapat Melihat Detail Pengiriman Pada Menu <br><b>History Pengiriman</b>",
+							html: true,
+							type: "success",
+							timer: 2500, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						if (isOpen) {
+							$('#modal-paket').modal('show');
+						}
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				})
+			});
+		}	
+	</script>
+
+
+</body>
+
+</html>

routes/user_after_login_ui/index.html

@@ -34,7 +34,7 @@
 		<a href="/admin" class="logo">Shenior Kurir</a>
 		<button type="button" class="button-close fa fa-times js__menu_close"></button>
 		<div class="user">
-			<a href="#" class="avatar"><img src="/images/person.png" alt=""><span class="status online"></span></a>
+			<a href="#" class="avatar"><img src="/images/person.png" id="img-avatar" alt="" style="width: 65px; height: 65px;"><span class="status online"></span></a>
 			<h5 class="name"><a href="#" id="h5-title">...</a></h5>
 			<h5 class="position">Pengguna</h5>
 			
@@ -57,10 +57,10 @@
 						<a class="waves-effect" href="/user/kirim-paket"><i class="menu-icon ico mdi mdi-motorbike"></i><span>Pengiriman Paket</span></a>
 					</li>
 
-					 <li>
-                        <a class="waves-effect" href="#" onclick="notAvailable()"><i
-                                class="menu-icon ico icon-table"></i><span>History Pengiriman</span></a>
-                    </li>
+					<li>
+						<a class="waves-effect" href="/user/history" ><i
+								class="menu-icon ico icon-table"></i><span>History Pengiriman</span></a>
+					</li>
 
 					<li>
                         <a class="waves-effect" href="/user/profil" ><i
@@ -200,6 +200,7 @@
 	<script>
 		const global_data = JSON.parse(localStorage.getItem('user'));
 		document.getElementById('h5-title').innerHTML = global_data.nama;
+		$("#img-avatar").attr("src", global_data.gambar == null || global_data.gambar == "" ? "/images/person.png" : "/user/gambar/" + global_data._id + "/" + global_data.gambar);
 	</script>
 
 </body>

routes/user_after_login_ui/paket.html

@@ -8,7 +8,7 @@
 	<meta name="description" content="">
 	<meta name="author" content="">
 
-	<title>Shenior Kurir | Pengiriman Paket</title>
+	<title>Shenior paket | Pengiriman Paket</title>
 
 	<!-- Main Styles -->
 	<link rel="stylesheet" href="/styles/style.min.css">
@@ -37,10 +37,11 @@
 <body>
 	<div class="main-menu">
 		<header class="header">
-			<a href="/admin" class="logo">Shenior Kurir</a>
+			<a href="/admin" class="logo">Shenior paket</a>
 			<button type="button" class="button-close fa fa-times js__menu_close"></button>
 			<div class="user">
-				<a href="#" class="avatar"><img src="/images/person.png" alt=""><span class="status online"></span></a>
+				<a href="#" class="avatar"><img src="/images/person.png" id="img-avatar" alt=""
+						style="width: 65px; height: 65px;"><span class="status online"></span></a>
 				<h5 class="name"><a href="#" id="h5-title">...</a></h5>
 				<h5 class="position">Pengguna</h5>
 
@@ -65,7 +66,7 @@
 					</li>
 
 					<li>
-						<a class="waves-effect" href="#" onclick="notAvailable()"><i
+						<a class="waves-effect" href="/user/history" ><i
 								class="menu-icon ico icon-table"></i><span>History Pengiriman</span></a>
 					</li>
 
@@ -109,16 +110,23 @@
 			<div class="row small-spacing">
 				<div class="col-xs-12">
 					<div class="box-content card">
-						<h4 class="box-title">Form Kurir</h4>
+						<h4 class="box-title">Form Pengiriman Paket</h4>
 						<!-- /.box-title -->
 						<div class="card-content">
 							<div class="form-group">
 								<button type="button" class="btn btn-sm btn-info btn-rounded waves-effect waves-light"
-									onclick="addpaketOpenModal()">Pendaftaran Kurir Baru</button>
+									onclick="addpaketOpenModal()">Pendaftaran Pengiriman Baru</button>
 							</div>
 
+							<div class="form-group text-center" id="text-tiada-pengiriman">
+								<p>Tidak ada pengiriman dilakukan</p>
+							</div>
+							<div class="form-group" id="form-tb-paket">
+								<table id="tb-paket" class="table table-striped table-bordered display"
+									style="width:100%">
 
-
+								</table>
+							</div>
 						</div>
 					</div>
 					<!-- /.box-content -->
@@ -147,6 +155,123 @@
 							aria-hidden="true">&times;</span></button>
 					<h4 class="modal-title" id="modal-paket-title">Modal title</h4>
 				</div>
+				<form class="modal-body" id="form-modal">
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-paket" style="display: none">
+							<center>
+								<div id="preview-gambar-paket" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-paket">
+						<!-- create upload -->
+						<label for="modal-paket-nama">Photo Paket</label>
+						<input type="file" class="form-control" id="gambar-paket" accept="image/*"
+							onchange="showUpload(this, 'gambar-paket')">
+					</div>
+
+					<div class="form-group" id="div-nomor-resi" style="display: none">
+						<label for="modal-paket-nomor-resi">Nomor Resi</label>
+						<input type="text" class="form-control" id="nomor_resi">
+					</div>
+
+					<div class="form-group" id="div-waktu-dibuat" style="display: none">
+						<label for="modal-paket-waktu-dibuat">Waktu Dibuat</label>
+						<input type="text" class="form-control" id="waktu_dibuat">
+					</div>
+
+					<div class="form-group" id="div-status" style="display: none">
+						<label for="modal-paket-div-status">Status</label>
+						<input type="text" class="form-control" id="status">
+					</div>
+
+
+					<div class="form-group">
+						<label for="modal-paket-nama-pengirim">Nama Pengirim</label>
+						<input type="text" class="form-control" id="nama_pengirim" placeholder="Masukkan Nama Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-pengirim">No Telpon/HP Pengirim</label>
+						<input type="text" class="form-control" id="no_telpon_pengirim" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Pengirim">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-pengirim">Alamat Pengirim</label>
+						<textarea name="alamat_pengirim" class="form-control" id="alamat_pengirim"
+							placeholder="Masukkan Alamat Pengirim" style="resize: none;"></textarea>
+					</div>
+
+					<hr>
+					<hr>
+
+					<div class="form-group">
+						<label for="modal-paket-nama-penerima">Nama Penerima</label>
+						<input type="text" class="form-control" id="nama_penerima" placeholder="Masukkan Nama Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-no-telpon-penerima">No Telpon/HP Penerima</label>
+						<input type="text" class="form-control" id="no_telpon_penerima" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP Penerima">
+					</div>
+
+					<div class="form-group">
+						<label for="modal-paket-alamat-penerima">Alamat Penerima</label>
+						<textarea name="alamat_penerima" class="form-control" id="alamat_penerima"
+							placeholder="Masukkan Alamat Penerima" style="resize: none;"></textarea>
+					</div>
+
+					<!-- ini dibawah untuk div tamnpilkan progress -->
+					<div id="div-form-progress">
+						<hr>
+
+						<div class="form-group" id="div-data-kurir">
+							<!-- create underline on <i> -->
+							<label for="modal-paket-berat">Kurir Yang Ditugaskan <i
+									style="text-decoration: underline;color: blue">(Klik Untuk Melihat Info
+									Kurir)</i></label>
+							<input type="text" class="form-control" id="input_kurir">
+						</div>
+
+						<hr>
+
+
+						<div class="form-group">
+							<label for="modal-paket-berat">Progress</label>
+							<div class="activity-list">
+							</div>
+						</div>
+					</div>
+					<!-- akhir div tampilan progress -->
+
+
+				</form>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default btn-sm waves-effect waves-light"
+						data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="btn-pengiriman"
+						onclick="tambahpengiriman()">Lakukan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-danger btn-sm waves-effect waves-light"
+						id="btn-batalkan-paket">Batalkan Pengiriman</button>
+					<button type="button" class="btn btn-xs btn-success btn-sm waves-effect waves-light"
+						id="btn-terima-paket">Paket Diterima</button>
+
+				</div>
+			</div>
+		</div>
+	</div>
+
+	<div class="modal fade" id="modal-kurir" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
+		<div class="modal-dialog" role="document">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
+							aria-hidden="true">&times;</span></button>
+					<h4 class="modal-title" id="modal-kurir-title">Modal title</h4>
+				</div>
 				<form class="modal-body" id="form-modal">
 					<div class="form-group">
 						<!-- show the upload -->
@@ -164,25 +289,50 @@
 					</div>
 
 					<div class="form-group">
-						<label for="modal-kurir-no-telpon">No Telpon/HP Yang Dihubungi</label>
-						<input type="text" class="form-control" id="no_telpon" oninput="numberOnly(this)" maxlength="13"
-							placeholder="Masukkan No Telpon/HP Yang Dihubungi">
+						<label for="modal-kurir-nama">Nama</label>
+						<input type="text" class="form-control" id="nama-kurir" placeholder="Masukkan Nama">
+					</div>
+					<div class="form-group">
+						<label for="modal-kurir-nama">No Telpon/HP</label>
+						<input type="text" class="form-control" id="no_telpon-kurir" oninput="numberOnly(this)"
+							maxlength="13" placeholder="Masukkan No Telpon/HP">
 					</div>
 
 					<div class="form-group">
-						<label for="modal-kurir-alamat">Alamat Pengiriman</label>
-						<textarea name="alamat" class="form-control" id="alamat"
-							placeholder="Masukkan Alamat"></textarea>
+						<label for="modal-kurir-nama">Jenis Kelamin</label>
+						<select class="form-control" id="jenis-kelamin-kurir">
+							<option value="" disabled selected>-Pilih Jenis Kelamin</option>
+							<option value="Laki-laki">Laki-laki</option>
+							<option value="Perempuan">Perempuan</option>
+						</select>
 					</div>
 					<hr>
+					<div class="form-group">
+						<!-- show the upload -->
+						<div id="show-upload-gambar-motor" style="display: none">
+							<center>
+								<div id="preview-gambar-motor" style="height: 200px; width: 150px"></div>
+							</center>
+						</div>
+					</div>
+					<div class="form-group" id="form-gambar-motor">
+						<!-- create upload -->
+						<label for="modal-kurir-nama">Photo Motor</label>
+						<input type="file" class="form-control" id="gambar-motor" accept="image/*"
+							onchange="showUpload(this, 'gambar-motor')">
+					</div>
+					<div class="form-group">
+						<label for="modal-kurir-dd-motor">DD Motor</label>
+						<input type="text" class="form-control" id="dd-motor-kurir" placeholder="Masukkan DD Motor">
+					</div>
+
+
+
 
 				</form>
 				<div class="modal-footer">
 					<button type="button" class="btn btn-default btn-sm waves-effect waves-light"
-						data-dismiss="modal">Close</button>
-					<button type="button" class="btn btn-primary btn-sm waves-effect waves-light" id="btn-pengiriman"
-						onclick="tambahpengiriman()">Lakukan Pengiriman</button>
-
+						id="button-close-modal-kurir">Close</button>
 				</div>
 			</div>
 		</div>
@@ -213,50 +363,629 @@
 	<script src="/plugin/toastr/toastr.min.js"></script>
 
 	<script src="/block/jquery.blockUI.js"></script>
+	<script src="/socket-io/client-dist/socket.io.js"></script>
 
 	<script src="/scripts/main.min.js"></script>
+
 	<script src="/my-js.js"></script>
-	<script src="/socket-io/client-dist/socket.io.js"></script>
+
+
 	<script>
-		const socket = io(); // Connects to your server
+		function showUpload(element) {
+			var file = element.files[0];
 
+			if (file) {
+				var reader = new FileReader();
+				reader.onload = function (event) {
+					var imageUrl = event.target.result;
 
-		socket.on('connect', () => {
-			console.log('Connected to server:', socket.id);
-		});
+					// Create an image element
+					var img = document.createElement('img');
+					img.src = imageUrl;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
 
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+				}
+				reader.readAsDataURL(file);
+			}
+		}
 
 
 	</script>
 	<script>
 		const global_data = JSON.parse(localStorage.getItem('user'));
 		document.getElementById('h5-title').innerHTML = global_data.nama;
-	</script>
-	<script>
-		function addpaketOpenModal() {
-			$('#modal-paket-title').html('Form Pengiriman Paket Baru');
-			$('#modal-paket').modal('show');
-		}
-		function tambahpengiriman() {
-			$.ajax({
-				url: '/user/kirim-paket/',
-				type: 'POST',
-				data: {},
-				beforeSend: function () {
+		$("#no_telpon_pengirim").val(global_data.no_telpon);
+		$("#nama_pengirim").val(global_data.nama);
+		$("#alamat_pengirim").val(global_data.alamat);
+		$("#img-avatar").attr("src", global_data.gambar == null || global_data.gambar == "" ? "/images/person.png" : "/user/gambar/" + global_data._id + "/" + global_data.gambar);
 
+		function reloadTable() {
+			// destroy table
+			// $('#tb-kurir').DataTable().destroy();
+			$('#tb-paket').DataTable({
+				// responsive: true,
+				scrollX: true,
+				// order: [
+				// 	[0, 'asc']
+				// ],
+				ajax: {
+					url: '/user/paket/' + global_data._id + '/paket',
+					type: 'GET',
+					timeout: 120000,
+					dataSrc: function (data) {
+						// console.log(data)
+						if (data.length == 0) {
+							$("#form-tb-paket").hide();
+							$("#text-tiada-pengiriman").show();
+						} else {
+							$("#form-tb-paket").show();
+							$("#text-tiada-pengiriman").hide();
+						}
+						return data.reverse();
+					}
 				},
-				success: function (data) {
-					console.log(data);
-					// This triggers the event
-					socket.emit('scan_dia_lagi', 'hello from paket.html');
-					$('#modal-paket').modal('hide');
-				},
-				error: function (xhr, status, error) {
-					console.log(error);
-				}
+				"sAjaxDataProp": "",
+				"aoColumns": [
+					// {
+					// 	"mData": "_id",
+					// 	"title": "No Resi",
+					// 	"render": function (data, type, row) {
+					// 		return data
+					// 	}
+					// },
+					{
+						"mData": "nama_pengirim",
+						"title": "Nama Pengirim",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "nama_penerima",
+						"title": "Nama Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "alamat_penerima",
+						"title": "Alamat Penerima",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": "status",
+						"title": "Status",
+						"render": function (data, type, row) {
+							return data
+						}
+					},
+					{
+						"mData": null,
+						"title": "Aksi",
+						"render": function (data, type, row) {
+							let html = '';
+							if (data.status == "Menunggu Admin Memproses") {
+								html = `<button type='button' onclick='deletepaket("${data._id}")' title='Batalkan Pengiriman' class='btn btn-danger btn-circle btn-sm waves-effect waves-light'><i class='ico icon-cancel-circled'></i></button>`;
+							}
+							return `<button type='button' onclick='open_modal_paket("${data._id}")' title='Detail Pengiriman' class='btn btn-info btn-circle btn-sm waves-effect waves-light'><i class='ico zmdi zmdi-info'></i></button> ${html}`
+						}
+					}
+				]
 
 			})
+
+
 		}
+
+		reloadTable()
+
+	</script>
+	<script src="/user.js"></script>
+
+	<script>
+		function addpaketOpenModal() {
+			$("#btn-pengiriman").show();
+			$("#btn-batalkan-paket").hide();
+			$("#div-form-progress").hide();
+			$("#btn-terima-paket").hide();
+			$('#modal-paket-title').html('Form Pengiriman Paket Baru');
+			$("#div-nomor-resi").hide();
+			$("#div-waktu-dibuat").hide();
+			$("#div-status").hide();
+			$("#nama_pengirim").val(global_data.nama);
+			$("#no_telpon_pengirim").val(global_data.no_telpon);
+			$("#alamat_pengirim").val(global_data.alamat);
+			$("#nama_penerima").val("");
+			$("#no_telpon_penerima").val("");
+			$("#alamat_penerima").val("");
+			$("#show-upload-gambar-paket").hide();
+			$("#gambar-paket").val('');
+			$('#form-modal :input').prop('disabled', false);
+			$('#modal-paket').modal({
+				backdrop: 'static',
+				keyboard: false  // Optional: prevents closing via Esc key
+			});
+		}
+		function tambahpengiriman() {
+			if ($("#gambar-paket")[0].files.length == 0) {
+				toastr.error("Foto Pengiriman Tidak Boleh Kosong");
+				// focus to input
+				$("#gambar-paket").focus();
+				return;
+			}
+			if ($("#nama_pengirim").val() == "") {
+				toastr.error("Nama Pengirim Tidak Boleh Kosong");
+				// focus to input
+				$("#nama_pengirim").focus();
+				return;
+			}
+
+			if ($("#no_telpon_pengirim").val() == "") {
+				toastr.error("No Telpon Pengirim Tidak Boleh Kosong");
+				// focus to input
+				$("#no_telpon_pengirim").focus();
+				return;
+			}
+
+			if ($("#alamat_pengirim").val() == "") {
+				toastr.error("Alamat Pengirim Tidak Boleh Kosong");
+				// focus to input
+				$("#alamat_pengirim").focus();
+				return;
+			}
+
+			if ($("#nama_penerima").val() == "") {
+				toastr.error("Nama Penerima Tidak Boleh Kosong");
+				// focus to input
+				$("#nama_penerima").focus();
+				return;
+			}
+
+			if ($("#no_telpon_penerima").val() == "") {
+				toastr.error("No Telpon Penerima Tidak Boleh Kosong");
+				// focus to input
+				$("#no_telpon_penerima").focus();
+				return;
+			}
+
+			if ($("#alamat_penerima").val() == "") {
+				toastr.error("Alamat Penerima Tidak Boleh Kosong");
+				// focus to input
+				$("#alamat_penerima").focus();
+				return;
+			}
+
+
+			swal({
+				title: "Yakin?",
+				text: "Anda yakin ingin mengirim paket?",
+				icon: "info",
+				showCancelButton: !0,
+				// confirmButtonColor: "#DD6B55",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+			}, function (y) {
+				if (y) {
+					let form_data = new FormData();
+					form_data.append('_id', global_data._id);
+					form_data.append('no_telpon_pengirim', $("#no_telpon_pengirim").val());
+					form_data.append('nama_pengirim', $("#nama_pengirim").val());
+					form_data.append('alamat_pengirim', $("#alamat_pengirim").val());
+					form_data.append('nama_penerima', $("#nama_penerima").val());
+					form_data.append('no_telpon_penerima', $("#no_telpon_penerima").val());
+					form_data.append('alamat_penerima', $("#alamat_penerima").val());
+					form_data.append('gambar_paket', $("#gambar-paket")[0].files[0]);
+
+					$.ajax({
+						url: '/user/kirim-paket/',
+						type: 'POST',
+						data: form_data,
+						contentType: false,
+						processData: false,
+						beforeSend: function () {
+							$('#modal-paket').modal('hide');
+							blockUI('Melakukan Permintaan Pengiriman Paket...');
+						},
+
+						complete: () => {
+							// console.log(data);
+
+							$.unblockUI();
+						},
+						success: (data) => {
+							console.log(data);
+							toastr.options.timeOut = 2500; // 2.5 seconds
+							toastr.success('Permintaan Pengiriman Paket Berhasil<br>Menunggu Admin Menyetujui');
+							$('#modal-paket').modal('hide');
+							// destroy table
+							$('#tb-paket').DataTable().destroy();
+							reloadTable();
+							// $.unblockUI();
+						},
+						// location.reload();
+						error: (xhr, status, error) => {
+							$('#modal-paket').modal('show');
+							console.log(xhr.responseJSON);
+							toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+							// $.unblockUI();
+						}
+					});
+
+				}
+			});
+
+
+
+		}
+
+		async function open_modal_paket(id) {
+			$("#btn-terima-paket").hide();
+			$("#div-form-progress").show();
+			$.ajax({
+				url: '/user/paket-detail/' + id,
+				type: 'GET',
+				timeout: 20000,
+				beforeSend: function () {
+					blockUI('Loading Data...');
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+				success: function (data) {
+					// Handle the response here
+
+					// let waktu_dibuat = new Date(data.createdAt);
+
+					$('#modal-paket-title').html('Form Detail Pengiriman Paket');
+
+					$("#btn-pengiriman").hide();
+					$("#btn-batalkan-paket").hide();
+					if (data.status == "Menunggu Admin Memproses") {
+						$("#btn-batalkan-paket").show();
+						// add onclick deletepaket(data._id);
+						$("#btn-batalkan-paket").attr('onclick', 'deletepaket("' + data._id + '")');
+					}
+
+					// $("#id").val(data._id);
+					$("#div-nomor-resi").show();
+					$("#nomor_resi").val(data._id);
+					$("#div-waktu-dibuat").show();
+					$("#waktu_dibuat").val(formatToMakassar(data.createdAt));
+					$("#div-status").show();
+					$("#status").val(data.status);
+					$("#no_telpon_pengirim").val(data.no_telpon_pengirim);
+					$("#nama_pengirim").val(data.nama_pengirim);
+					$("#alamat_pengirim").val(data.alamat_pengirim);
+					$("#no_telpon_penerima").val(data.no_telpon_penerima);
+					$("#nama_penerima").val(data.nama_penerima);
+					$("#alamat_penerima").val(data.alamat_penerima);
+					// $("#gambar-paket").attr("src", data.gambar_paket);
+
+					var img = document.createElement('img');
+					img.src = "/user/paket-detail/" + data._id + "/" + data.gambar_paket;
+					// make the width 150px and height 150px
+					img.style.width = '150px';
+					img.style.height = '150px';
+					const id = 'show-upload-gambar-paket'
+
+					const id_preview = 'preview-gambar-paket'
+					// Get the preview div
+					var previewDiv = document.getElementById(`${id_preview}`);
+					$('#' + id).show();
+
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					// disable all input in #form-modal
+					$("#form-gambar-paket").hide();
+
+					$('#form-modal :input').prop('disabled', true);
+
+					// tampilkan data kurir
+					if (data.nama_kurir) {
+						$("#input_kurir").val(data.nama_kurir);
+						$("#div-data-kurir").attr("onclick", `liat_info_kurir('${data.id_kurir}', '${data._id}')`);
+						$("#div-data-kurir").show();
+					} else {
+						$("#div-data-kurir").hide();
+					}
+
+					let activity_html = '';
+					for (let i = data.timeline.length - 1; i >= 0; i--) {
+						let colornya = 'bg-info';
+
+						if (data.timeline[i].status == 'Paket Telah Diterima Penerima') {
+							colornya = 'bg-success';
+						}
+
+						if (data.timeline[i].status.includes('Dibatalkan')) {
+							colornya = 'bg-danger';
+						}
+
+						activity_html += `<div class="activity-item">
+							<div class="bar ${colornya}">
+							<div class="dot ${colornya}"></div>
+							</div>
+							<div class="content">
+							<div class="date">${formatToMakassar(data.timeline[i].waktu)}</div>
+							<div class="text">
+								${data.timeline[i].status}
+								${!data.timeline[i].gambar ? "" : `<br><img src="/kurir/gambar-paket/${data._id}/${data.timeline[i].gambar}" width="100px" height="100px">`} 
+							</div>
+							</div>
+						</div>`;
+					}
+
+					$('.activity-list').html(activity_html);
+
+					if (data.status == "Paket Telah Diterima Penerima") {
+						$("#btn-terima-paket").show();
+						$("#btn-terima-paket").attr("onclick", `terima_paket('${data._id}')`);
+					}
+
+					$('#modal-paket').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+				},
+				error: function (xhr, status, error) {
+					console.error('AJAX error:', error);
+				}
+			});
+
+
+
+
+			// console.log(id);
+
+		}
+
+
+		function liat_info_kurir(id_kurir, id) {
+			// close modal-paket 
+			$('#modal-paket').modal('hide');
+			console.log(id_kurir, id)
+			selectClicked = false
+
+			$("#button-close-modal-kurir").attr("onclick", `close_modal_kurir('${id}')`);
+			$.ajax({
+				type: 'GET',
+				url: '/user/cek-kurir/' + id_kurir,
+				dataType: 'json',
+				beforeSend: function () {
+					blockUI('Loading')
+				},
+				complete: function () {
+					$.unblockUI();
+				},
+
+				success: function (data) {
+					console.log(data)
+					$('#modal-kurir-title').html('Detail Kurir')
+					// hide form-gambar div
+					$("#form-gambar-kurir").attr("hidden", true);
+					$("#form-gambar-motor").attr("hidden", true);
+					$("#no_telpon-kurir").val(data.no_telpon)
+					$("#nama-kurir").val(data.nama)
+					$("#jenis-kelamin-kurir").val(data.jenis_kelamin)
+					$("#dd-motor-kurir").val(data.dd_motor)
+					// disable all input in #form-modal
+
+					enableInput(true)
+
+					var img = document.createElement('img');
+					img.src = 'kurir/gambar/' + data.no_telpon + '/' + data.gambar_kurir;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					// Get the preview div
+					var previewDiv = document.getElementById('preview-gambar-kurir');
+					$('#show-upload-gambar-kurir').show();
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img);
+
+					var img = document.createElement('img');
+					img.src = 'kurir/gambar/' + data.no_telpon + '/' + data.gambar_motor;
+					img.style.maxWidth = '100%'; // Make the image fit the width of the div
+					img.style.maxHeight = '100%'; // Make the image fit the height of the div
+
+					// Get the preview div
+					var previewDiv = document.getElementById('preview-gambar-motor');
+					$('#show-upload-gambar-motor').show();
+					// Clear any existing content in the preview div
+					previewDiv.innerHTML = '';
+
+					// Append the image to the preview div
+					previewDiv.appendChild(img)
+
+					$('#modal-kurir').modal({
+						backdrop: 'static',
+						keyboard: false  // Optional: prevents closing via Esc key
+					});
+
+				},
+				error: function (xhr, status, error) {
+					// console.error('AJAX error:', error);
+					// $('#modal-paket').modal('show');
+					console.log(xhr.responseJSON);
+					toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+				}
+			})
+
+
+
+		}
+
+		function close_modal_kurir(id) {
+			$('#modal-kurir').modal('hide');
+
+			// 1.5 sec then open modal
+			setTimeout(function () {
+				$('#modal-paket').modal('show');
+			}, 500);
+			// reloadTable(id);
+		}
+
+
+		function terima_paket(id) {
+			// close modal-paket
+			$('#modal-paket').modal('hide');
+
+			swal({
+				title: "Apakah Anda Yakin?",
+				text: "Paket Telah Diterima",
+				type: "success",
+				showCancelButton: !0,
+				confirmButtonColor: "green",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+			}, function (willAccept) {
+				if (!willAccept) {
+					// show modal
+					$('#modal-paket').modal('show');
+					return;
+				}
+
+				swal.close();
+				// console.log(id)
+				$.ajax({
+					type: 'POST',
+					url: '/user/terima-paket/' + id,
+					data: {
+						id_pengirim: global_data._id,
+					},
+					dataType: 'json',
+					beforeSend: function () {
+						blockUI('Loading')
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data)
+						setTimeout(function () {
+							swal({
+								title: "Sukses",
+								text: "Anda Dapat Melihat Detail Pengiriman Pada Menu <br><b>History Pengiriman</b>",
+								html: true,
+								type: "success",
+								timer: 3500, // time in milliseconds (2000ms = 2 seconds)
+								showConfirmButton: false
+							});
+						}, 250);
+						// destroy modal
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						$('#modal-paket').modal('show');
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				})
+
+				// setTimeout(function () {
+
+				// }, 250);
+
+			});
+
+		}
+
+		function deletepaket(id) {
+			// console.log(id)
+
+			const isOpen = $('#modal-paket').is(':visible');
+			if (isOpen) {
+				$('#modal-paket').modal('hide');
+			}
+			console.log(isOpen);
+			swal({
+				title: "Apakah Anda Yakin?",
+				text: "Anda Akan Membatal Pengiriman dengan No Resi <br><b>" + id + "</b>",
+				html: true,
+				type: "warning",
+				showCancelButton: !0,
+				confirmButtonColor: "red",
+				cancelButtonColor: "#d33",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+				closeOnConfirm: !1,
+				closeOnCancel: !1
+			}, function (willDelete) {
+				if (!willDelete) {
+					swal.close();
+					// show modal
+					if (isOpen) {
+						$('#modal-paket').modal('show');
+					}
+					
+					return;
+				}
+
+				swal.close();
+				// console.log(id)
+				$.ajax({
+					type: 'DELETE',
+					url: '/user/delete-paket/' + id,
+					data: {
+						id_pengirim: global_data._id,
+					},
+					dataType: 'json',
+					beforeSend: function () {
+						blockUI('Loading')
+					},
+					complete: function () {
+						$.unblockUI();
+					},
+					success: function (data) {
+						console.log(data)
+						// destroy modal
+						$('#tb-paket').DataTable().destroy();
+						reloadTable();
+						swal({
+							title: "Sukses",
+							text: "Pengiriman Berhasil Dibatalkan, Anda Dapat Melihat Detail Pengiriman Pada Menu <br><b>History Pengiriman</b>",
+							html: true,
+							type: "success",
+							timer: 2500, // time in milliseconds (2000ms = 2 seconds)
+							showConfirmButton: false
+						});
+					},
+					error: function (xhr, status, error) {
+						// console.error('AJAX error:', error);
+						if (isOpen) {
+							$('#modal-paket').modal('show');
+						}
+						console.log(xhr.responseJSON);
+						toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+					}
+				})
+			});
+		}	
 	</script>
 
 

routes/user_after_login_ui/profil.html

@@ -0,0 +1,358 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+	<meta http-equiv="X-UA-Compatible" content="IE=edge">
+	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+	<meta name="description" content="">
+	<meta name="author" content="">
+
+	<title>Shenior Kurir | Profil Pengguna</title>
+
+	<!-- Main Styles -->
+	<link rel="stylesheet" href="/styles/style.min.css">
+
+	<!-- mCustomScrollbar -->
+	<link rel="stylesheet" href="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.min.css">
+
+	<!-- Waves Effect -->
+	<link rel="stylesheet" href="/plugin/waves/waves.min.css">
+
+	<!-- Sweet Alert -->
+	<link rel="stylesheet" href="/plugin/sweet-alert/sweetalert.css">
+
+	<link rel="stylesheet" href="/fonts/fontello/fontello.css">
+
+	<link rel="stylesheet" href="/fonts/material-design-iconic-font/css/material-design-iconic-font.min.css">
+	<link rel="stylesheet" href="/fonts/material-design/css/materialdesignicons.css">
+
+
+
+	<!-- Toastr -->
+	<link rel="stylesheet" href="/plugin/toastr/toastr.css">
+	<script src="/auth.js"></script>
+</head>
+
+<body>
+	<div class="main-menu">
+		<header class="header">
+			<a href="/admin" class="logo">Shenior Kurir</a>
+			<button type="button" class="button-close fa fa-times js__menu_close"></button>
+			<div class="user">
+				<a href="#" class="avatar"><img src="/images/person.png" id="img-avatar" alt=""
+						style="width: 65px; height: 65px;"><span class="status online"></span></a>
+				<h5 class="name"><a href="#" id="h5-title">...</a></h5>
+				<h5 class="position">Pengguna</h5>
+
+			</div>
+			<!-- /.user -->
+		</header>
+		<!-- /.header -->
+		<div class="content">
+
+			<div class="navigation">
+				<h5 class="title">Navigasi</h5>
+				<!-- /.title -->
+				<ul class="menu js__accordion">
+					<li>
+						<a class="waves-effect" href="/user"><i class="menu-icon fa fa-home"></i><span>Halaman
+								Utama</span></a>
+					</li>
+
+					<li ">
+						<a class=" waves-effect" href="/user/kirim-paket"><i class="menu-icon ico mdi mdi-motorbike"></i><span>Pengiriman
+							Paket</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" href="/user/history" ><i
+								class="menu-icon ico icon-table"></i><span>History Pengiriman</span></a>
+					</li>
+
+					<li class="current active">
+						<a class="waves-effect" href="/user/profil"><i class="menu-icon ico icon-user"></i><span>Profil
+								Pengunna</span></a>
+					</li>
+
+					<li>
+						<a class="waves-effect" onclick="logout()" href="#"><i
+								class="menu-icon ico icon-logout"></i><span>Logout</span></a>
+					</li>
+				</ul>
+
+			</div>
+			<!-- /.navigation -->
+		</div>
+		<!-- /.content -->
+	</div>
+	<!-- /.main-menu -->
+
+	<div class="fixed-navbar">
+		<div class="pull-left">
+			<button type="button"
+				class="menu-mobile-button glyphicon glyphicon-menu-hamburger js__menu_mobile"></button>
+			<h1 class="page-title">Pengiriman Paket</h1>
+			<!-- /.page-title -->
+		</div>
+		<!-- /.pull-left -->
+		<div class="pull-right">
+
+
+			<a href="#" class="ico-item ico icon-logout" onclick="logout()"></a>
+		</div>
+		<!-- /.pull-right -->
+	</div>
+	<!-- /.fixed-navbar -->
+
+	<div id="wrapper">
+		<div class="main-content">
+			<div class="row small-spacing">
+				<div class="col-lg-6 col-md-6 col-xs-12">
+					<div class="box-content card">
+						<h4 class="box-title">Profil Pengguna</h4>
+						<!-- /.box-title -->
+						<div id="form-profil" class="card-content">
+							<div class="form-group">
+								<!-- show the upload -->
+								<div id="show-upload-gambar-profil">
+									<center>
+										<div id="preview-gambar-profil" style="height: 150px; width: 150px">
+											<img id="img-gambar-profil" style="height: 150px; width: 150px">
+										</div>
+									</center>
+								</div>
+							</div>
+
+							<div class="form-group" id="form-gambar-profil" style="display: none">
+								<!-- create upload -->
+								<label for="photo-form">Photo Profil</label>
+								<input type="file" class="form-control" id="gambar-profil" accept="image/*"
+									onchange="showUpload(this, 'gambar-profil')">
+							</div>
+
+							<div class="form-group">
+								<label for="nama">Nama</label>
+								<input type="text" class="form-control" id="nama" placeholder="Masukkan Nama">
+							</div>
+
+							<div class="form-group">
+								<label for="no-telpon">No Telpon</label>
+								<input type="text" class="form-control" id="no_telpon" oninput="numberOnly(this)"
+									maxlength="13" placeholder="Masukkan No Telpon/HP Yang Dihubungi">
+							</div>
+
+							<div class="form-group">
+								<label for="alamat">Alamat </label>
+								<textarea name="alamat" class="form-control" id="alamat" placeholder="Masukkan Alamat"
+									style="resize: none"></textarea>
+							</div>
+							<div class="form-group text-center">
+								<button type="button" class="btn btn-info btn-xs" id="btn-edit-profil"
+									onclick="editprofil()">Edit
+									Profil?</button>
+								<button type="button" class="btn btn-primary btn-xs" id="btn-update-profil"
+									onclick="updateprofil()" style="display: none">Update Profil</button> &nbsp;
+								<button type="button" class="btn btn-default btn-xs" id="btn-cancel-profil"
+									onclick="cancelprofil()" style="display: none">Cancel</button>
+							</div>
+
+							</form>
+						</div>
+						<!-- /.box-content -->
+					</div>
+
+
+
+				</div>
+				<div class="col-lg-6 col-md-6 col-xs-12">
+					<div class="box-content card">
+						<h4 class="box-title">Ganti Password</h4>
+						<!-- /.box-title -->
+						<div class="card-content">
+
+
+							<div class="form-group">
+								<label for="nama">Password Lama</label>
+								<input type="password" class="form-control" id="password_lama"
+									placeholder="Masukkan Password Lama">
+							</div>
+
+							<div class="form-group">
+								<label for="nama">Password Baru</label>
+								<input type="password" class="form-control" id="password_baru"
+									placeholder="Masukkan Password Baru">
+							</div>
+							<div class="form-group">
+								<label for="nama">Konfirmasi Password Baru</label>
+								<input type="password" class="form-control" id="konfirmasi_password_baru"
+									placeholder="Masukkan Konfirmasi Password Baru">
+							</div>
+							<div class="form-group text-center">
+
+								<button type="button" class="btn btn-primary btn-xs" id="btn-update-password"
+									onclick="notAvailable()">Update Password</button>
+							</div>
+
+							</form>
+						</div>
+						<!-- /.box-content -->
+					</div>
+
+
+
+				</div>
+			</div>
+
+			<footer class="footer">
+				<ul class="list-inline">
+					<li>Arifuddin Naawi Amanah © 2025.</li>
+					<!-- <li><a href="#">Privacy</a></li>
+				<li><a href="#">Terms</a></li>
+				<li><a href="#">Help</a></li> -->
+				</ul>
+			</footer>
+		</div>
+		<!-- /.main-content -->
+	</div><!--/#wrapper -->
+
+
+	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
+	<!--[if lt IE 9]>
+		<script src="/script/html5shiv.min.js"></script>
+		<script src="/script/respond.min.js"></script>
+	<![endif]-->
+	<!-- 
+	================================================== -->
+	<!-- Placed at the end of the document so the pages load faster -->
+	<script src="/scripts/jquery.min.js"></script>
+	<script src="/scripts/modernizr.min.js"></script>
+	<script src="/plugin/bootstrap/js/bootstrap.min.js"></script>
+	<script src="/plugin/mCustomScrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+	<script src="/plugin/nprogress/nprogress.js"></script>
+	<script src="/plugin/sweet-alert/sweetalert.min.js"></script>
+	<script src="/plugin/waves/waves.min.js"></script>
+	<!-- Full Screen Plugin -->
+	<script src="/plugin/fullscreen/jquery.fullscreen-min.js"></script>
+
+
+	<!-- Toastr -->
+	<script src="/plugin/toastr/toastr.min.js"></script>
+
+	<script src="/block/jquery.blockUI.js"></script>
+
+	<script src="/scripts/main.min.js"></script>
+	<script src="/my-js.js"></script>
+	<script>
+		const global_data = JSON.parse(localStorage.getItem('user'));
+		document.getElementById('h5-title').innerHTML = global_data.nama;
+
+
+		function editprofil() {
+			document.querySelectorAll('#form-profil input, #form-profil select, #form-profil textarea').forEach(el => {
+				el.disabled = false;
+				// disable no_telpon input
+				$("#no_telpon").attr("disabled", true);
+			});
+
+			$("#form-gambar-profil").show();
+			$("#btn-edit-profil").hide();
+			$("#btn-update-profil").show();
+			$("#btn-cancel-profil").show();
+		}
+
+		function cancelprofil() {
+			$("#nama").val(global_data.nama);
+			$("#no_telpon").val(global_data.no_telpon);
+			$("#alamat").val(global_data.alamat);
+			$("#img-gambar-profil").attr("src", global_data.gambar == null || global_data.gambar == "" ? "/images/person.png" : "/user/gambar/" + global_data._id + "/" + global_data.gambar);
+			$("#img-avatar").attr("src", global_data.gambar == null || global_data.gambar == "" ? "/images/person.png" : "/user/gambar/" + global_data._id + "/" + global_data.gambar);
+			document.querySelectorAll('#form-profil input, #form-profil select, #form-profil textarea').forEach(el => {
+				el.disabled = true;
+				$("#no_telpon").attr("disabled", true);
+			});
+			$("#form-gambar-profil").hide();
+			$("#btn-edit-profil").show();
+			$("#btn-update-profil").hide();
+			$("#btn-cancel-profil").hide();
+		}
+		cancelprofil();
+
+		function showUpload(element) {
+			var file = element.files[0];
+
+			if (file) {
+				var reader = new FileReader();
+				reader.onload = function (event) {
+					var imageUrl = event.target.result;
+					// put the image in id="img-gambar-profil" with height: 150px; width: 150px
+					$("#img-gambar-profil").attr("src", imageUrl);
+					// $("#img-gambar-profil").css("height", "150px");
+					// $("#img-gambar-profil").css("width", "150px");
+				}
+				reader.readAsDataURL(file);
+			}
+		}
+
+		function updateprofil() {
+			let form_data = new FormData();
+			form_data.append('id', global_data.id);
+			form_data.append('nama', $("#nama").val());
+			form_data.append('no_telpon', $("#no_telpon").val());
+			form_data.append('alamat', $("#alamat").val());
+			// check if there is a file
+			form_data.append('ada_file', $("#gambar-profil")[0].files.length > 0 ? 1 : 0);
+			if ($("#gambar-profil")[0].files.length > 0) {
+				form_data.append('gambar', $("#gambar-profil")[0].files[0]);
+			}
+
+			swal({
+				title: "Yakin?",
+				text: "Anda yakin ingin update profil?",
+				icon: "info",
+				showCancelButton: !0,
+				// confirmButtonColor: "#DD6B55",
+				confirmButtonText: "Ya",
+				cancelButtonText: "Tidak",
+			}, function (y) {
+				if (y) {
+
+
+					$.ajax({
+						url: '/user/' + global_data._id,
+						type: 'PUT',
+						data: form_data,
+						contentType: false,
+						processData: false,
+						beforeSend: function () {
+							blockUI('Update Profil Sedang Diproses...');
+						},
+						success: function (data) {
+							console.log(data);
+							localStorage.setItem('user', JSON.stringify(data));
+							toastr.success('Profil berhasil diupdate');
+							setTimeout(() => {
+								$.unblockUI();
+								window.location.reload();
+							}, 1500);
+							// cancelprofil();
+
+
+						},
+						error: function (xhr, status, error) {
+							console.log(xhr.responseJSON);
+							toastr.error(xhr.responseJSON !== undefined ? xhr.responseJSON : "Terjadi Kesalahan Server");
+							$.unblockUI();
+						}
+					})
+
+				}
+			})
+		}
+	</script>
+
+
+
+</body>
+
+</html>

routes/user_router.ts

@@ -2,20 +2,29 @@ import express from 'express';
 import type { Request, Response } from 'express';
 import PendafaranBaruModel from '../models/pendaftaran_baru_model';
 import UserModel from '../models/user_model';
+import KirimanModel from '../models/kiriman_model';
+import KurirModel from '../models/kurir_model';
 import type { UploadedFile } from 'express-fileupload';
 import path from 'path';
 import fs from 'fs';
 import axios from 'axios';
+import { socket_client } from '../index';
+
+// import { io, Socket } from 'socket.io-client';
+
+
+// const socket_client: Socket = io("http://localhost:3014");
 
 const router = express.Router();
-import * as socket from '../socket';
-const socket_client = socket.clientSocket;
+
 
 router.get('/', (req: Request, res: Response) => {
     // socket_client.emit('scan_dia', 'test');
     res.sendFile(__dirname + '/user_ui/index.html');
 });
 
+
+
 // router.get('/coba', async (req: Request, res: Response) => {
 //     res.status(200).json('success');
 // })
@@ -102,21 +111,153 @@ router.get('/user', (req: Request, res: Response) => {
     res.sendFile(__dirname + '/user_after_login_ui/index.html');
 })
 
+router.get('/user/gambar/:id/:gambar', (req: Request, res: Response) => {
+    const { id, gambar } = req.params;
+    // console.log(id, gambar);
+    const gambarPath = path.join(__dirname, '../images/user/' + id + '/' + gambar);
+    res.sendFile(gambarPath);
+})
+
+router.put('/user/:_id', async (req: Request, res: Response) => {
+    const { _id } = req.params;
+    const { nama, alamat, ada_file } = req.body;
+    let gambar_name = "";
+    if (ada_file > 0) {
+        const { gambar } = req.files as { gambar: UploadedFile };
+        // console.log(gambar);
+        const userDir = path.join(__dirname, '../images/user/' + _id);
+        if (!fs.existsSync(userDir)) {
+            fs.mkdirSync(userDir);
+        }
+        // delete all file on userDir
+        const files = fs.readdirSync(userDir);
+        for (const file of files) {
+            fs.unlinkSync(path.join(userDir, file));
+        }
+
+        const gambarPath = path.join(userDir, gambar.name);
+        gambar_name = gambar.name;
+        // console.log(gambarPath);
+        await gambar.mv(gambarPath);
+    }
+
+
+    const response = await UserModel.findOneAndUpdate({ _id }, { $set: { nama, alamat, gambar: gambar_name } }, { new: true });
+    console.log(response);
+    res.status(200).json(response);
+})
+
 
 router.get('/user/kirim-paket', async (req: Request, res: Response) => {
     res.sendFile(__dirname + '/user_after_login_ui/paket.html');
 })
 
 router.post('/user/kirim-paket', async (req: Request, res: Response) => {
-    console.log("kirim paket");
-    socket_client.emit('scan_dia', 'ini dari kirim-paket');
-    res.status(200).json("ini")
+    const { _id, no_telpon_pengirim, nama_pengirim, alamat_pengirim, no_telpon_penerima, nama_penerima, alamat_penerima } = req.body;
+    const { gambar_paket } = req.files as { gambar_paket: UploadedFile };
+
+    const userNoTelpon = (await UserModel.findOne({ _id }).select('no_telpon'))?.no_telpon;
+    // console.log(userNoTelpon);
+
+    const newKiriman = new KirimanModel({ id_pengirim: _id, no_telpon_pengirim, nama_pengirim, alamat_pengirim, no_telpon_penerima, nama_penerima, alamat_penerima, gambar_paket: gambar_paket.name });
+    await newKiriman.save();
+    // console.log(newKiriman);
+
+    const gambarPath = path.join(__dirname, '../images/kiriman/' + newKiriman._id + '/' + gambar_paket.name);
+    await gambar_paket.mv(gambarPath);
+
+    const message = `Pengiriman anda dengan nomor resi ${newKiriman._id} sedang diproses oleh admin.`;
+
+    try {
+        await axios.post('http://localhost:3012/send-message', { number: userNoTelpon, message: message });
+    } catch (error) {
+        console.log(error);
+    }
+
+    socket_client.emit('pengiriman_baru_server');
+
+    res.status(200).json("ini kirim paket")
 })
 
-router.get('/user/kirim-paket1', async (req: Request, res: Response) => {
-    console.log("kirim paket");
-    socket_client.emit('scan_dia', 'ini dari kirim-paket');
-    res.status(200).json("ini")
+router.get("/user/paket/:id/:status", async (req: Request, res: Response) => {
+    try {
+        const { id, status } = req.params;
+        console.log(id);
+        let response
+        if (status == "paket") {
+            // check where status is not "Dibatalkan Oleh Admin"
+            response = await KirimanModel.find({
+                id_pengirim: id,
+                status: {
+                    $nin: ['Dibatalkan Oleh Admin', 'Diterima Terverifikasi',"Dibatalkan Oleh Pengirim"],
+                    $type: 'string'
+                }
+            });
+        } else {
+            response = await KirimanModel.find({ id_pengirim: id });
+        }
+        console.log(response);
+        res.status(200).json(response);
+    } catch (error) {
+        console.log(error);
+        res.status(400).json([]);
+    }
+
+})
+
+router.get("/user/paket-detail/:id", async (req: Request, res: Response) => {
+    const { id } = req.params;
+    console.log(id);
+    try {
+        const response = await KirimanModel.findOne({ _id: id }).lean();
+        if (!response) {
+            res.status(404).json("Data tidak ditemukan");
+            return;
+        }
+        let responseWithKurir = {};
+        if (response.id_kurir) {
+            const kurirData = await KurirModel.findOne({ _id: response.id_kurir });
+
+
+            responseWithKurir = {
+                ...response,
+                nama_kurir: kurirData?.nama,
+                no_telpon_kurir: kurirData?.no_telpon
+            };
+            console.log(responseWithKurir);
+        }
+        // await 2 sec
+        // await new Promise((resolve) => setTimeout(resolve, 2000));
+        res.status(200).json(response.id_kurir ? responseWithKurir : response);
+    } catch (error) {
+        console.log(error);
+        res.status(400).json("error menampilkan data");
+    }
+})
+
+
+router.get("/user/paket-detail/:id/:gambar", async (req: Request, res: Response) => {
+    let { id, gambar } = req.params;
+    // console.log(id , gambar);
+    try {
+        const response = await KirimanModel.findOne({ _id: id, gambar_paket: gambar });
+        const gambarPath = path.join(__dirname, '../images/kiriman/' + id + '/' + gambar);
+        res.sendFile(gambarPath);
+        // await 2 sec
+        // await new Promise((resolve) => setTimeout(resolve, 2000));
+        // res.status(200).json(response);
+    } catch (error) {
+        console.log(error);
+        res.status(400).json("error menampilkan data");
+    }
+    // res.status(200).json("success");
+
+})
+
+
+
+router.get('/user/profil', (req: Request, res: Response) => {
+    res.sendFile(__dirname + '/user_after_login_ui/profil.html');
 })
 
 
@@ -146,7 +287,142 @@ router.post('/user/check', async (req: Request, res: Response) => {
 
 })
 
+router.get('/user/cek-kurir/:id', async (req: Request, res: Response) => {
+    const { id } = req.params;
+    console.log(id);
 
+    if (!id) {
+        res.status(400).json('Bad Request');
+        return;
+    }
+    // res.status(200).json('Success');
+    try {
+        const kurir = await KurirModel.findOne({ _id: id });
+        // console.log(kurir);
+        if (!kurir) {
+            res.status(400).json('Kurir not found');
+            return;
+        }
+        res.status(200).json(kurir);
+        return;
+    } catch (error) {
+        console.log(error);
+        res.status(500).json('Terjadi Kesalahan Server');
+        return
+    }
+})
+
+
+router.get('/user/kurir/gambar/:no_telpon/:jenis', (req: Request, res: Response) => {
+    const { no_telpon, jenis } = req.params;
+    if (!no_telpon) {
+        res.status(400).json({ error: 'No Telpon is required.' });
+        return
+    }
+    KurirModel.findOne({ no_telpon }).then((data) => {
+        // if data not found
+        if (!data) {
+            res.status(404).json({ error: 'Kurir not found.' });
+            return
+        }
+        // Define file paths
+        const motorGambar = path.join(__dirname, '../images/' + jenis + '/' + data.gambar_motor);
+        const kurirGambar = path.join(__dirname, '../images/kurir/' + data.gambar_kurir);
+
+        if (jenis == 'motor') {
+            res.sendFile(motorGambar);
+        } else {
+            res.sendFile(kurirGambar);
+        }
+    })
+})
+
+router.post('/user/terima-paket/:id_kiriman', async (req: Request, res: Response) => {
+    const { id_kiriman } = req.params;
+    const { id_pengirim } = req.body;
+    console.log(id_kiriman, id_pengirim);
+
+    if (!id_kiriman || !id_pengirim) {
+        res.status(400).json('Bad Request');
+        return;
+    }
+
+    // cek the kiriman by id : id_kiriman , id_pengirim : id_pengirim
+    const kiriman = await KirimanModel.findOne({ _id: id_kiriman, id_pengirim });
+    if (!kiriman) {
+        res.status(400).json('Kiriman not found');
+        return;
+    }
+
+    try {
+        const updatedDoc = await KirimanModel.findOneAndUpdate({ _id: id_kiriman }, {
+            $set: {
+                status: 'Diterima Terverifikasi'
+            },
+            $push: {
+                timeline: {
+                    status: 'Diterima Terverifikasi',
+                    waktu: new Date(),
+                    // alasan: alasan || null,
+                    id_kurir: kiriman.id_kurir
+                }
+            }
+        }, { new: true });
+        console.log(updatedDoc, "diterima terverifikasi");
+        socket_client.emit('diterima_terverifikasi', updatedDoc);
+        res.status(200).json('Success');
+    } catch (error) {
+        console.log(error);
+        res.status(500).json('Terjadi Kesalahan Server');
+    }
+
+
+
+})
+
+router.delete('/user/delete-paket/:id_kiriman', async (req: Request, res: Response) => {
+    const { id_kiriman } = req.params;
+    const { id_pengirim } = req.body;
+
+    if (!id_kiriman || !id_pengirim) {
+        res.status(400).json('Bad Request');
+        return;
+    }
+
+    // search by id : id_kiriman , id_pengirim : id_pengirim
+    const kirimanData =  await KirimanModel.findOne({ _id: id_kiriman, id_pengirim });
+    if (!kirimanData) {
+        res.status(400).json('Kiriman not found');
+        return;
+    }
+
+    try {
+        // delete the kiriman
+        const deletedDoc = await KirimanModel.findOneAndUpdate({ _id: id_kiriman }, {
+            $set: {
+                status: 'Dibatalkan Oleh Pengirim'
+            },
+            $push: {
+                timeline: {
+                    status: 'Dibatalkan Oleh Pengirim',
+                    waktu: new Date(),
+                    // alasan: alasan || null,
+                    id_kurir: kirimanData.id_kurir
+                }
+            }
+        }, { new: true });
+        socket_client.emit('delete_kiriman', deletedDoc);
+        res.status(200).json('Success');
+    } catch (error) {
+        console.log(error);
+        res.status(500).json('Terjadi Kesalahan Server');
+    }
+})
+
+
+router.get('/user/history', async (req: Request, res: Response) => {
+    res.sendFile(__dirname + '/user_after_login_ui/history.html');
+})    
 // This should be the last route
 router.use((req: Request, res: Response) => {
     res.status(404).sendFile(__dirname + '/user_ui/404.html');

routes/user_ui/index.html

@@ -215,9 +215,9 @@
 	<script src="/socket-io/client-dist/socket.io.js"></script>
 	<script>
 		console.log('hello');
-		const socket = io(); // Connects to your server
+		const socket = io("http://20.20.20.26:3014"); // Connects to your server
 
-		socket.emit('scan_dia', 'Hello from client!');
+		// socket.emit('scan_dia', 'Hello from client!');
 
 		socket.on('connect', () => {
 			console.log('Connected to server:', socket.id);

socket.ts

@@ -1,33 +0,0 @@
-import { Server as HttpServer } from 'http';
-import { Server as SocketIOServer, Socket } from 'socket.io';
-import { io as socketClient, Socket as ClientSocket } from 'socket.io-client';
-import dotenv from 'dotenv';
-
-dotenv.config();
-
-const clientSocket: ClientSocket = socketClient(`http://localhost:3011`);
-
-let io: SocketIOServer | null = null;
-
-function init(server: HttpServer): SocketIOServer {
-  io = new SocketIOServer(server, {
-        cors: {
-            origin: "*", // ← Make sure this is set
-            methods: ["GET", "POST"]
-        }
-    });
-  return io;
-}
-
-function getIO(): SocketIOServer {
-  if (!io) {
-    throw new Error('Socket.io not initialized');
-  }
-  return io;
-}
-
-export {
-  init,
-  getIO,
-  clientSocket
-};

tokens/kurir-bot/Default/Extension Rules/LOG

@@ -1,3 +1,3 @@
-2025/05/16-03:20:33.782 1e9bf Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/MANIFEST-000001
-2025/05/16-03:20:33.783 1e9bf Recovering log #3
-2025/05/16-03:20:33.786 1e9bf Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/000003.log 
+2025/06/22-15:00:26.231 a0531 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/MANIFEST-000001
+2025/06/22-15:00:26.231 a0531 Recovering log #3
+2025/06/22-15:00:26.247 a0531 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/000003.log 

tokens/kurir-bot/Default/Extension Rules/LOG.old

@@ -1,3 +1,3 @@
-2025/05/16-02:47:14.070 1b121 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/MANIFEST-000001
-2025/05/16-02:47:14.071 1b121 Recovering log #3
-2025/05/16-02:47:14.071 1b121 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/000003.log 
+2025/06/15-09:07:58.994 ae2d0 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/MANIFEST-000001
+2025/06/15-09:07:58.994 ae2d0 Recovering log #3
+2025/06/15-09:07:59.012 ae2d0 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Rules/000003.log 

tokens/kurir-bot/Default/Extension Scripts/LOG

@@ -1,3 +1,3 @@
-2025/05/16-03:20:33.788 1e9bf Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/MANIFEST-000001
-2025/05/16-03:20:33.788 1e9bf Recovering log #3
-2025/05/16-03:20:33.789 1e9bf Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/000003.log 
+2025/06/22-15:00:26.272 a0531 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/MANIFEST-000001
+2025/06/22-15:00:26.272 a0531 Recovering log #3
+2025/06/22-15:00:26.277 a0531 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/000003.log 

tokens/kurir-bot/Default/Extension Scripts/LOG.old

@@ -1,3 +1,3 @@
-2025/05/16-02:47:14.071 1b121 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/MANIFEST-000001
-2025/05/16-02:47:14.072 1b121 Recovering log #3
-2025/05/16-02:47:14.072 1b121 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/000003.log 
+2025/06/15-09:07:59.038 ae2d0 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/MANIFEST-000001
+2025/06/15-09:07:59.038 ae2d0 Recovering log #3
+2025/06/15-09:07:59.052 ae2d0 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension Scripts/000003.log 

tokens/kurir-bot/Default/Extension State/LOG

@@ -1,3 +1,3 @@
-2025/05/16-03:20:34.510 1e9c0 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/MANIFEST-000001
-2025/05/16-03:20:34.510 1e9c0 Recovering log #3
-2025/05/16-03:20:34.516 1e9c0 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/000003.log 
+2025/06/22-15:00:27.721 a0532 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/MANIFEST-000001
+2025/06/22-15:00:27.721 a0532 Recovering log #3
+2025/06/22-15:00:27.731 a0532 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/000003.log 

tokens/kurir-bot/Default/Extension State/LOG.old

@@ -1,3 +1,3 @@
-2025/05/16-02:47:15.101 1b122 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/MANIFEST-000001
-2025/05/16-02:47:15.102 1b122 Recovering log #3
-2025/05/16-02:47:15.102 1b122 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/000003.log 
+2025/06/15-09:08:01.434 ae2d1 Reusing MANIFEST /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/MANIFEST-000001
+2025/06/15-09:08:01.435 ae2d1 Recovering log #3
+2025/06/15-09:08:01.451 ae2d1 Reusing old log /home/ubuntu-cli/bun/kurir-server/tokens/kurir-bot/Default/Extension State/000003.log