创维机顶盒动态密码在线计算

wx文新 · 发表于 2026-7-30 13:55

毒中毒 · 发表于 2026-7-30 15:49

感谢分享

jsy8968 · 发表于 2026-7-30 15:51

看看

我嘞个神啊 · 发表于 2026-7-30 21:59

<html lang="zh-CN">
<head>
<script defer src="/_vercel/insights/script.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<meta name="color-scheme" content="light dark">
<title>创维 ADB 计算</title>
<link rel="icon" href="https://www.skyworth.com/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="https://www.skyworth.com/favicon.ico" type="image/x-icon">
<style>
      * {
         box-sizing: border-box;
         margin: 0;
         padding: 0;
      }

      :root {
         --bg: #eef4ff;
         --bg-top: #f9fbff;
         --card: rgba(255, 255, 255, 0.72);
         --card-strong: rgba(255, 255, 255, 0.88);
         --line: rgba(29, 59, 112, 0.12);
         --text-main: #0d1526;
         --text-soft: #66758f;
         --accent: #1b76d1;
         --accent-strong: #0d63bb;
         --accent-glow: rgba(27, 118, 209, 0.18);
         --blob-1: rgba(127, 191, 255, 0.34);
         --blob-2: rgba(124, 204, 255, 0.22);
         --btn-text: #ffffff;
         --shadow-lg: 0 24px 60px rgba(69, 101, 148, 0.18);
         --shadow-md: 0 16px 34px rgba(69, 101, 148, 0.12);
         --radius-md: 18px;
         --transition: 220ms cubic-bezier(0.22, 1, 0.36, 1);
      }

      @media (prefers-color-scheme: dark) {
         :root {
            --bg: #0b1322;
            --bg-top: #111c30;
            --card: rgba(18, 28, 46, 0.72);
            --card-strong: rgba(22, 34, 56, 0.88);
            --line: rgba(152, 190, 255, 0.18);
            --text-main: #edf4ff;
            --text-soft: #9fb0cb;
            --accent: #7abcff;
            --accent-strong: #9ed1ff;
            --accent-glow: rgba(122, 188, 255, 0.2);
            --blob-1: rgba(67, 120, 201, 0.32);
            --blob-2: rgba(84, 151, 219, 0.22);
            --btn-text: #081321;
            --shadow-lg: 0 24px 60px rgba(0, 0, 0, 0.34);
            --shadow-md: 0 16px 34px rgba(0, 0, 0, 0.24);
         }
      }

      html {
         scroll-behavior: smooth;
      }

      body {
         display: flex;
         align-items: center;
         justify-content: center;
         min-height: 100vh;
         padding: 32px 24px;
         overflow-x: hidden;
         font-family: "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
         color: var(--text-main);
         background:
            radial-gradient(circle at 10% 12%, var(--blob-1), transparent 24%),
            radial-gradient(circle at 88% 8%, var(--blob-2), transparent 20%),
            linear-gradient(180deg, var(--bg-top) 0%, var(--bg) 100%);
         line-height: 1.55;
         transition: background var(--transition), color var(--transition);
      }

      body::before,
      body::after {
         content: "";
         position: fixed;
         width: 320px;
         height: 320px;
         border-radius: 50%;
         pointer-events: none;
         filter: blur(90px);
         opacity: 0.75;
         z-index: 0;
      }

      body::before {
         top: -90px;
         right: -110px;
         background: color-mix(in srgb, var(--accent) 42%, transparent 58%);
      }

      body::after {
         left: -120px;
         bottom: -120px;
         background: color-mix(in srgb, var(--accent) 28%, transparent 72%);
      }

      .page-wrap {
         position: relative;
         z-index: 1;
         width: min(100%, 780px);
         max-width: 780px;
         margin: 0 auto;
      }

      .hero-shell {
         position: relative;
         padding: 36px;
         border-radius: 36px;
         overflow: hidden;
         background: linear-gradient(180deg, var(--card-strong), var(--card));
         border: 1px solid color-mix(in srgb, var(--line) 72%, white 28%);
         box-shadow: var(--shadow-lg);
         backdrop-filter: blur(20px) saturate(140%);
         -webkit-backdrop-filter: blur(20px) saturate(140%);
         animation: floatIn 550ms ease-out;
      }

      .hero-shell::before {
         content: "";
         position: absolute;
         inset: 0;
         background:
            linear-gradient(135deg, rgba(255, 255, 255, 0.4), transparent 34%),
            linear-gradient(180deg, rgba(255, 255, 255, 0.12), transparent 70%);
         pointer-events: none;
      }

      .hero-top {
         position: relative;
         display: flex;
         justify-content: center;
         margin-bottom: 28px;
         text-align: center;
      }

      h1 {
         font-size: clamp(34px, 5.4vw, 50px);
         line-height: 1.12;
         margin-bottom: 4px;
      }

      .content-grid {
         position: relative;
         display: grid;
         grid-template-columns: minmax(0, 1fr);
         gap: 22px;
      }

      .panel {
         position: relative;
      }

      .input-column {
         display: flex;
         flex-direction: column;
         gap: 22px;
      }

      .m3-text-field {
         position: relative;
         animation: slideUp 500ms ease-out both;
      }

      .m3-text-field:nth-child(2) {
         animation-delay: 80ms;
      }

      .m3-text-field input {
         width: 100%;
         height: 84px;
         padding: 34px 20px 14px;
         border: 1px solid var(--line);
         border-radius: var(--radius-md);
         background: color-mix(in srgb, var(--card) 86%, transparent 14%);
         color: var(--text-main);
         font-size: 20px;
         font-weight: 600;
         outline: none;
         transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition), background var(--transition), color var(--transition);
         backdrop-filter: blur(16px);
         -webkit-backdrop-filter: blur(16px);
      }

      .m3-text-field input:focus {
         transform: translateY(-1px);
         border-color: color-mix(in srgb, var(--accent) 60%, transparent 40%);
         background: color-mix(in srgb, var(--card-strong) 94%, transparent 6%);
         box-shadow: 0 0 0 6px var(--accent-glow);
      }

      .m3-text-field label {
         position: absolute;
         left: 20px;
         top: 12px;
         color: var(--text-main);
         font-size: 14px;
         font-weight: 700;
         pointer-events: none;
      }

      .m3-text-field input:focus ~ label,
      .m3-text-field input:not(:placeholder-shown) ~ label {
         color: var(--accent-strong);
      }

      .actions {
         display: flex;
         justify-content: center;
         margin-top: 26px;
         animation: slideUp 500ms ease-out both;
         animation-delay: 160ms;
      }

      .m3-fab-large {
         position: relative;
         overflow: hidden;
         width: 100%;
         padding: 0 26px;
         height: 68px;
         border: 1px solid color-mix(in srgb, var(--accent) 20%, transparent 80%);
         border-radius: var(--radius-md);
         background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 85%, white 15%) 0%, var(--accent-strong) 100%);
         color: var(--btn-text);
         font-size: 18px;
         font-weight: 700;
         cursor: pointer;
         box-shadow: 0 16px 30px color-mix(in srgb, var(--accent) 22%, transparent 78%);
         transition: transform var(--transition), box-shadow var(--transition), filter var(--transition);
      }

      .m3-fab-large::after {
         content: "";
         position: absolute;
         inset: 0;
         background: linear-gradient(120deg, transparent 20%, rgba(255, 255, 255, 0.42) 48%, transparent 72%);
         transform: translateX(-140%);
         transition: transform 700ms ease;
      }

      .m3-fab-large:hover {
         transform: translateY(-2px);
         box-shadow: 0 22px 40px color-mix(in srgb, var(--accent) 28%, transparent 72%);
         filter: saturate(1.05);
      }

      .m3-fab-large:hover::after {
         transform: translateX(140%);
      }

      .m3-fab-large:disabled {
         cursor: wait;
         opacity: 0.72;
         transform: none;
      }

      .result-card {
         margin-top: 30px;
         padding: 28px 24px;
         border-radius: 22px;
         background:
            radial-gradient(circle at top, color-mix(in srgb, var(--accent) 24%, transparent 76%), transparent 42%),
            linear-gradient(180deg, color-mix(in srgb, var(--card-strong) 96%, white 4%), color-mix(in srgb, var(--card) 92%, transparent 8%));
         border: 1px solid color-mix(in srgb, var(--line) 72%, white 28%);
         backdrop-filter: blur(18px);
         -webkit-backdrop-filter: blur(18px);
         text-align: center;
         box-shadow: var(--shadow-md);
         animation: slideUp 560ms ease-out both;
         animation-delay: 240ms;
      }

      .result-title {
         font-size: 13px;
         letter-spacing: 0.14em;
         text-transform: uppercase;
         color: var(--text-soft);
         margin-bottom: 14px;
      }

      .result-code {
         font-size: clamp(42px, 8vw, 74px);
         font-weight: 800;
         line-height: 1;
         color: var(--text-main);
         text-shadow: 0 10px 24px color-mix(in srgb, var(--accent) 14%, transparent 86%);
         word-break: break-all;
         cursor: default;
         user-select: text;
      }

      .copy-toast {
         display: none;
      }

      @keyframes floatIn {
         from {
            opacity: 0;
            transform: translateY(18px) scale(0.985);
         }
         to {
            opacity: 1;
            transform: translateY(0) scale(1);
         }
      }

      @keyframes slideUp {
         from {
            opacity: 0;
            transform: translateY(16px);
         }
         to {
            opacity: 1;
            transform: translateY(0);
         }
      }

      @media (max-width: 820px) {
         body {
            align-items: flex-start;
            padding: 18px;
         }

         .hero-shell {
            padding: 26px 22px;
            border-radius: 28px;
         }

         .hero-top,
         .content-grid {
            grid-template-columns: 1fr;
            display: grid;
         }
      }

      @media (max-width: 560px) {
         .actions {
            display: grid;
         }

         .m3-text-field input {
            height: 76px;
            font-size: 18px;
         }

         .result-card,
         .hero-shell {
            padding-left: 20px;
            padding-right: 20px;
         }

         .result-code {
            font-size: clamp(34px, 14vw, 58px);
         }
      }
</style>
</head>
<body>
<div class="page-wrap">
      <section class="hero-shell">
         <div class="hero-top">
            <div>
                  <h1>创维 ADB 密码计算器</h1>
            </div>
         </div>

         <div class="content-grid">
            <div class="panel">
                  <div class="input-column">
                     <div class="m3-text-field">
                        <input type="text" id="mac" placeholder=" " autocomplete="off">
                        <label>MAC 地址</label>
                     </div>
                     <div class="m3-text-field">
                        <input type="text" id="random" placeholder=" " autocomplete="off">
                        <label>随机码</label>
                     </div>
                  </div>

                  <div class="actions">
                     <button class="m3-fab-large" id="calcBtn">计算</button>
                  </div>
            </div>
         </div>

         <div class="result-card">
            <div class="result-title">动态密码</div>
            <div class="result-code" id="resultValue">--</div>
         </div>
      </section>
</div>

<div class="copy-toast" id="copyToast"></div>

<script>
      async function compute() {
         const mac = document.getElementById('mac').value.trim();
         const randomVal = document.getElementById('random').value.trim();
         const button = document.getElementById('calcBtn');
         const resultValue = document.getElementById('resultValue');

         if (!mac || !randomVal) {
            alert('请填写 MAC 地址和随机码');
            return;
         }

         button.disabled = true;
         button.textContent = '计算中';
         resultValue.textContent = '...';

         try {
            const response = await fetch('/api/calculate', {
                  method: 'POST',
                  headers: {
                     'Content-Type': 'application/json'
                  },
                  body: JSON.stringify({
                     mac: mac,
                     random: randomVal
                  })
            });

            const data = await response.json();

            if (!response.ok) {
                  throw new Error(data.error || '计算失败');
            }

            resultValue.textContent = data.result;
         } catch (error) {
            resultValue.textContent = '--';
            alert(error.message || '计算失败，请稍后重试');
         } finally {
            button.disabled = false;
            button.textContent = '计算';
         }
      }

      document.getElementById('calcBtn').addEventListener('click', compute);

      document.querySelectorAll('input').forEach(function(input) {
         input.addEventListener('keypress', function(event) {
            if (event.key === 'Enter') {
                  compute();
            }
         });
      });
</script>
</body>
</html>

› 智能电视盒 / 安卓TV机顶盒区 › 创维盒子论坛

创维机顶盒动态密码在线计算

创维机顶盒动态密码在线计算

站长推荐 /1