Spaces:

CVNSS
/

sapnhap

Running

App Files Files Community

CVNSS commited on Jul 11, 2025

Commit

46054ae

verified ·

1 Parent(s): a144027

Update index.html

Browse files

Files changed (1) hide show

index.html +196 -19

index.html CHANGED Viewed

@@ -1,19 +1,196 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="vi">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Trợ lý Hành chính Phường/Xã</title>
+  <style>
+    body {
+      font-family: 'Arial', sans-serif;
+      line-height: 1.6;
+      color: #333;
+      max-width: 800px;
+      margin: 0 auto;
+      padding: 20px;
+      background-color: #f5f5f5;
+    }
+    header {
+      text-align: center;
+      margin-bottom: 30px;
+      padding-bottom: 15px;
+      border-bottom: 1px solid #e0e0e0;
+    }
+    h1 {
+      color: #2c3e50;
+      font-size: 24px;
+      margin-bottom: 5px;
+    }
+    .input-section {
+      background-color: #fff;
+      padding: 20px;
+      border-radius: 5px;
+      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+      margin-bottom: 20px;
+    }
+    label {
+      display: block;
+      margin-bottom: 8px;
+      font-weight: bold;
+    }
+    input[type="text"] {
+      width: 100%;
+      padding: 10px;
+      border: 1px solid #ddd;
+      border-radius: 4px;
+      font-size: 16px;
+      box-sizing: border-box;
+      margin-bottom: 10px;
+    }
+    button {
+      background-color: #3498db;
+      color: white;
+      border: none;
+      padding: 10px 20px;
+      border-radius: 4px;
+      cursor: pointer;
+      font-size: 16px;
+      transition: background-color 0.3s;
+    }
+    button:hover {
+      background-color: #2980b9;
+    }
+    #output {
+      background-color: #fff;
+      padding: 20px;
+      border-radius: 5px;
+      box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+      min-height: 150px;
+      white-space: pre-wrap;
+    }
+    .status {
+      color: #7f8c8d;
+      font-style: italic;
+    }
+    /* Kiểu dáng cho kết quả đầu ra sạch sẽ */
+    .clean-output {
+      font-family: 'Arial', sans-serif;
+      line-height: 1.6;
+    }
+    .clean-output strong {
+      font-weight: bold;
+      color: #2c3e50;
+    }
+  </style>
+</head>
+<body>
+  <header>
+    <h1>Trợ lý Hành chính Phường/Xã</h1>
+    <p>Hỗ trợ tra cứu thông tin hành chính</p>
+  </header>
+  <section class="input-section">
+    <label for="query">Nhập yêu cầu tra cứu:</label>
+    <input type="text" id="query" placeholder="Ví dụ: Phường Phú Tân thuộc quận/huyện nào?">
+    <button onclick="sendQuery()">Tra cứu</button>
+  </section>
+  <section>
+    <h2>Kết quả tra cứu</h2>
+    <div id="output" class="status clean-output">Kết quả sẽ hiển thị tại đây sau khi tra cứu...</div>
+  </section>
+  <script src="https://cdn.socket.io/4.5.4/socket.io.min.js"></script>
+  <script>
+    const socket = io("wss://tracuuphuongxa.trolyao.org", {
+      transports: ["websocket"]
+    });
+    socket.on("connect", () => {
+      console.log("Kết nối thành công:", socket.id);
+    });
+    socket.on("disconnect", () => {
+      console.log("Mất kết nối với hệ thống");
+    });
+    socket.on("chat_on_response_chunk", (chunk) => {
+      const output = document.getElementById("output");
+      if (output.classList.contains("status")) {
+        output.classList.remove("status");
+      }
+      // Xử lý làm sạch kết quả đầu ra
+      let cleanChunk = chunk
+        .replace(/###/g, '') // Loại bỏ dấu ###
+        .replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>') // Chuyển **text** thành <strong>
+        .replace(/\n/g, '<br>'); // Xử lý xuống dòng
+      output.innerHTML += cleanChunk;
+    });
+    function sendQuery() {
+      const userInput = document.getElementById("query").value.trim();
+      if (!userInput) {
+        alert("Vui lòng nhập yêu cầu tra cứu");
+        return;
+      }
+      const output = document.getElementById("output");
+      output.innerHTML = "Đang xử lý yêu cầu...";
+      output.className = "status clean-output";
+      const payload = {
+        history: [
+          { user: userInput, bot: "" }
+        ],
+        approach: "rrr",
+        username: "anonymous_phuongxa",
+        fullname: "anonymous_phuongxa",
+        overrides: {
+          user_model: "llm-vtcc-foundation-70b",
+          retrieval_mode: "text",
+          temperature: 0.2,
+          fulltext_search_retriever: true,
+          use_whitelist: true,
+          use_summary_answer: true,
+          confirm_decision: true,
+          use_llm_filter: true,
+          use_confirm_answer: true,
+          chatgpt_model: "llm-vtcc-foundation-70b",
+          chatgpt_model_gen_query: "llm-vtcc-foundation-70b",
+          model_llm_search: "GPT-4o-128K",
+          model_llm_filter: "GPT-4o-128K",
+          use_reference: false,
+          regen_reference: false,
+          use_api_search_tree: false,
+          type_hybrid_search: "Priority semantic",
+          type_search_engine: "bing",
+          mode_think: false,
+          mode_search: false,
+          no_prompt: false
+        }
+      };
+      socket.emit("request_chatbot", JSON.stringify(payload));
+    }
+    // Xử lý phím Enter
+    document.getElementById("query").addEventListener("keypress", function(event) {
+      if (event.key === "Enter") {
+        sendQuery();
+      }
+    });
+  </script>
+</body>
+</html>