diff --git a/app/Http/Controllers/Api/TrafficController.php b/app/Http/Controllers/Api/TrafficController.php
new file mode 100644
index 0000000..66fb080
--- /dev/null
+++ b/app/Http/Controllers/Api/TrafficController.php
@@ -0,0 +1,50 @@
+<?php
+
+namespace App\Http\Controllers\Api;
+
+use App\Http\Controllers\Controller;
+use Illuminate\Support\Facades\Cache;
+
+class TrafficController extends Controller
+{
+    public function free()
+    {
+        $user = auth()->user();
+
+        $day = now()->day;
+        $last_sign_at = Cache::get('traffic_sign:' . $day . '-' . $user->id, null);
+
+        return $this->success([
+            'traffic' => $user->traffic ?? 0,
+            'is_signed' => $last_sign_at
+        ]);
+    }
+
+    public function sign()
+    {
+        $user = auth()->user();
+
+        $day = now()->day;
+        $last_sign_at = Cache::get('traffic_sign:' . $day . '-' . $user->id, null);
+
+        // 如果 24 小时内已经签到过了，就不再签到。
+        if ($last_sign_at) {
+            return $this->error('您已经签到过了，请明天再来吧。');
+        }
+
+        // 随机 config('settings.sign.min') 到 config('settings.sign.max')
+        $traffic = rand(config('settings.sign.min'), config('settings.sign.max'));
+
+        if ($traffic !== -1) {
+            $user->traffic += $traffic;
+            $user->save();
+        }
+
+        Cache::put('traffic_sign:' . $day . '-' . $user->id, true);
+
+        return $this->success([
+            'traffic' => $traffic,
+            'last_sign_at' => now()->toDateTimeString(),
+        ]);
+    }
+}
diff --git a/app/Http/Controllers/Application/UserController.php b/app/Http/Controllers/Application/UserController.php
index 858db13..7280472 100644
--- a/app/Http/Controllers/Application/UserController.php
+++ b/app/Http/Controllers/Application/UserController.php
@@ -12,7 +12,7 @@ class UserController extends Controller
     /**
      * Display a listing of the resource.
      */
-    public function index()
+    public function index(Request $request)
     {
         //
     }
diff --git a/config/settings.php b/config/settings.php
new file mode 100644
index 0000000..b7149ab
--- /dev/null
+++ b/config/settings.php
@@ -0,0 +1,8 @@
+<?php
+
+return [
+    'sign' => [
+        'max' => 10,
+        'min' => 1,
+    ]
+];
diff --git a/resources/js/components/Menu.vue b/resources/js/components/Menu.vue
index 0b90318..c48f85f 100644
--- a/resources/js/components/Menu.vue
+++ b/resources/js/components/Menu.vue
@@ -20,17 +20,19 @@ const items = ref([
     {
         name: "首页",
         route: "index",
+    },
+      {
+        name: "签到",
+        route: "sign",
     },
     {
         name: "隧道",
         route: "tunnels",
     },
-
     {
         name: "创建隧道",
         route: "tunnels.create",
     },
-
     {
         name: "客户端下载",
         route: "downloads",
diff --git a/resources/js/plugins/router.js b/resources/js/plugins/router.js
index 414a3c7..28745df 100644
--- a/resources/js/plugins/router.js
+++ b/resources/js/plugins/router.js
@@ -1,4 +1,4 @@
-import {createRouter, createWebHistory} from "vue-router";
+import { createRouter, createWebHistory } from "vue-router";
 // import app from "../config/app";
 
 const routes = [
@@ -42,9 +42,14 @@ const routes = [
             title: "客户端下载",
         },
     },
-
-
-
+    {
+        path: "/sign",
+        name: "sign",
+        component: () => import("../views/Sign.vue"),
+        meta: {
+            title: "签到",
+        },
+    },
 ];
 
 
@@ -58,7 +63,7 @@ routes.forEach((route) => {
     route.beforeEnter = (to, from, next) => {
         // 如果是管理员页面，且用户不是管理员，则跳转到首页
         if (route.meta.admin && !isAdmin()) {
-            next({name: "index"});
+            next({ name: "index" });
         } else {
             next();
         }
diff --git a/resources/js/views/Sign.vue b/resources/js/views/Sign.vue
new file mode 100644
index 0000000..41f7c16
--- /dev/null
+++ b/resources/js/views/Sign.vue
@@ -0,0 +1,71 @@
+<template>
+    <div>
+        <h1>流量补给</h1>
+
+        <div>
+            <p>当前流量: {{ traffic.traffic }}GB</p>
+            <div v-if="traffic.is_signed">今日已签到</div>
+            <div v-else>
+                <button class="btn btn-primary" @click="sign">试试手气</button>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script setup>
+import { ref } from "vue";
+
+import http from "../plugins/http";
+
+const traffic = ref({
+    last_sign_at: null,
+    traffic: 0,
+});
+
+http.get("user")
+    .then((res) => {
+        traffic.value.traffic = res.data.traffic;
+    })
+
+function sign() {
+    http.post("traffic")
+        .then((res) => {
+            traffic.value = res.data;
+
+            let content = `获得了 ${res.data.traffic} GB 流量！`;
+
+            if (res.data.traffic === 0) {
+                content = "没有获得流量～";
+            }
+
+            alert(content);
+        })
+        .finally(() => {
+            http.get("user")
+                .then((res) => {
+                    traffic.value.traffic = res.data.traffic;
+                })
+                .finally(() => {
+                    // refreshSign()
+                });
+        });
+}
+
+// function refreshSign() {
+//   const date = new Date(traffic.value.last_sign_at)
+//
+//
+//   if (traffic.value.last_sign_at) {
+//     date.setDate(date.getDate() + 1)
+//     // nextSignAt.value = date.toLocaleString()
+//     // 算出差多少小时
+//     const diff = date.getTime() - new Date().getTime()
+//     const hours = Math.floor(diff / 1000 / 60 / 60)
+//     const minutes = Math.floor(diff / 1000 / 60 % 60)
+//     nextSignAt.value = `${hours} 小时 ${minutes} 分钟`
+//
+//   } else {
+//     nextSignAt.value = null
+//   }
+// }
+</script>
diff --git a/routes/api.php b/routes/api.php
index 1c0b545..179fcf2 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -6,6 +6,7 @@
 use App\Http\Controllers\Api\ServerController;
 use App\Http\Controllers\Api\TunnelController;
 use App\Http\Controllers\Api\PortManagerController;
+use App\Http\Controllers\Api\TrafficController;
 use App\Http\Controllers\Application\UserController as ApplicationUserController;
 
 Route::prefix('tunnel')->name('api.tunnel.')->group(function () {
@@ -18,6 +19,10 @@
     Route::apiResource('tunnels', TunnelController::class);
     Route::post('tunnels/{tunnel}/close', [TunnelController::class, 'close']);
     Route::apiResource('servers', ServerController::class);
+
+    Route::get('traffic', [TrafficController::class, 'free']);
+    Route::post('traffic', [TrafficController::class, 'sign']);
+
 });
 
 Route::prefix('application')->name('application.')->middleware('api_token')->group(function () {