Startsida Utforska Hjälp
Registrera dig Logga in
cwg-crm
/
cwg_crm_person_front_vu_realse
2
0
Fork 0
Filer Ärenden 0 Pull-förfrågningar 0 Wiki
Bläddra i källkod

落地页

zhb 3 veckor sedan
förälder
b289444769
incheckning
621d55870d
21 ändrade filer med 7217 tillägg och 0 borttagningar
Unifierad Vy Visa Diff Statistik
  1. 450 0
      vu/bank.html
  2. 514 0
      vu/forget.html
  3. 702 0
      vu/info.html
  4. 337 0
      vu/info.js
  5. 457 0
      vu/kycAuth.html
  6. 301 0
      vu/kycAuth.js
  7. 288 0
      vu/maintenance.html
  8. 394 0
      vu/pay/acepayment.html
  9. 394 0
      vu/pay/alpha.html
  10. 394 0
      vu/pay/b2bpay.html
  11. 394 0
      vu/pay/hypehashing.html
  12. 394 0
      vu/pay/nace.html
  13. 101 0
      vu/pay/onchainpay.html
  14. 208 0
      vu/pay/paycard.html
  15. 221 0
      vu/pay/paypaga.html
  16. 485 0
      vu/payment.html
  17. 288 0
      vu/resetMam.html
  18. 499 0
      vu/resetTrading.html
  19. 70 0
      vu/test.html
  20. 183 0
      vu/unsubscribe.html
  21. 143 0
      vu/upload.js

+ 450 - 0
vu/bank.html
Visa fil 

@@ -0,0 +1,450 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8" />
 
+    <title>Bank</title>
 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
+    <meta name="full-screen" content="yes">
 
+    <meta name="x5-fullscreen" content="true">
 
+    <meta name="viewport"
 
+        content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+    <link rel="stylesheet" href="css/element-ui.css" />
 
+    <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+    <link rel="stylesheet" href="css/index.css" />
 
+
 
+    <style>
 
+        :root {
 
+            --brand-red: #eb3f57;
 
+            --brand-red-dark: #d92f48;
 
+            --brand-red-soft: #fff1f3;
 
+            --text-main: #111827;
 
+            --text-secondary: #4b5563;
 
+            --text-muted: #9ca3af;
 
+            --border: #e5e7eb;
 
+            --card-bg: rgba(255, 255, 255, .96);
 
+            --page-bg: #f5f7fb;
 
+            --radius-xl: 30px;
 
+            --radius-lg: 22px;
 
+            --radius-md: 16px;
 
+            --shadow-card:
 
+                0 24px 70px rgba(17, 24, 39, .08),
 
+                0 6px 20px rgba(17, 24, 39, .05);
 
+            --shadow-red:
 
+                0 14px 30px rgba(235, 63, 87, .28);
 
+        }
 
+
 
+        * {
 
+            box-sizing: border-box;
 
+        }
 
+
 
+        body {
 
+            margin: 0;
 
+            min-height: 100vh;
 
+            background:
 
+                radial-gradient(circle at top left, rgba(235, 63, 87, .12), transparent 32%),
 
+                radial-gradient(circle at top right, rgba(59, 130, 246, .1), transparent 30%),
 
+                var(--page-bg);
 
+            font-family:
 
+                Inter,
 
+                -apple-system,
 
+                BlinkMacSystemFont,
 
+                "Segoe UI",
 
+                sans-serif;
 
+            color: var(--text-main);
 
+            -webkit-font-smoothing: antialiased;
 
+        }
 
+
 
+        img {
 
+            display: block;
 
+            max-width: 100%;
 
+        }
 
+
 
+        .container {
 
+            width: 100%;
 
+        }
 
+
 
+        .upload-page {
 
+            width: 100%;
 
+            min-height: 100vh;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            padding: 32px 20px;
 
+        }
 
+
 
+        .upload-card {
 
+            width: min(760px, 100%);
 
+            border-radius: var(--radius-xl);
 
+            border: 1px solid rgba(255, 255, 255, .75);
 
+            background: var(--card-bg);
 
+            backdrop-filter: blur(18px);
 
+            box-shadow: var(--shadow-card);
 
+            overflow: hidden;
 
+        }
 
+
 
+        .card-header {
 
+            padding: 30px 34px;
 
+            border-bottom: 1px solid var(--border);
 
+            background:
 
+                linear-gradient(180deg,
 
+                    #ffffff 0%,
 
+                    #fafcff 100%);
 
+        }
 
+
 
+        .header-top {
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: space-between;
 
+            gap: 20px;
 
+        }
 
+
 
+        .title-group {
 
+            display: flex;
 
+            align-items: center;
 
+            gap: 16px;
 
+        }
 
+
 
+        .title-icon {
 
+            width: 52px;
 
+            height: 52px;
 
+            border-radius: 18px;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            background: var(--brand-red-soft);
 
+            color: var(--brand-red);
 
+            font-size: 26px;
 
+        }
 
+
 
+        .title-text h1 {
 
+            margin: 0;
 
+            font-size: 28px;
 
+            line-height: 1.2;
 
+            font-weight: 850;
 
+            letter-spacing: -.03em;
 
+        }
 
+
 
+        .title-text p {
 
+            margin: 8px 0 0;
 
+            color: var(--text-secondary);
 
+            font-size: 14px;
 
+        }
 
+
 
+        .language-switch {
 
+            display: inline-flex;
 
+            align-items: center;
 
+            gap: 8px;
 
+            padding: 10px 12px;
 
+            border-radius: 999px;
 
+            border: 1px solid var(--border);
 
+            background: #fff;
 
+        }
 
+
 
+        .language-switch img {
 
+            width: 18px;
 
+            height: 12px;
 
+            object-fit: cover;
 
+        }
 
+
 
+        .language-switch .menu {
 
+            font-size: 14px;
 
+            font-weight: 650;
 
+            cursor: pointer;
 
+        }
 
+
 
+        .format-badges {
 
+            display: flex;
 
+            flex-wrap: wrap;
 
+            gap: 8px;
 
+            margin-top: 18px;
 
+        }
 
+
 
+        .format-badge {
 
+            padding: 6px 12px;
 
+            border-radius: 999px;
 
+            background: #fff;
 
+            border: 1px solid var(--border);
 
+            color: var(--text-secondary);
 
+            font-size: 12px;
 
+            font-weight: 700;
 
+        }
 
+
 
+        .card-body {
 
+            padding: 38px 34px;
 
+        }
 
+
 
+        .upload-box {
 
+            width: 100%;
 
+        }
 
+
 
+        .upload-box .el-upload {
 
+            width: 100%;
 
+            height: 260px;
 
+            border: 2px dashed #d7dce4;
 
+            border-radius: 24px;
 
+            background: #fff;
 
+            overflow: hidden;
 
+            cursor: pointer;
 
+            transition:
 
+                border-color .22s ease,
 
+                transform .22s ease,
 
+                box-shadow .22s ease,
 
+                background-color .22s ease;
 
+        }
 
+
 
+        .upload-box .el-upload:hover {
 
+            border-color: var(--brand-red);
 
+            background: #fff7f8;
 
+            transform: translateY(-2px);
 
+            box-shadow:
 
+                0 18px 38px rgba(235, 63, 87, .12);
 
+        }
 
+
 
+        .upload-inner {
 
+            width: 100%;
 
+            height: 100%;
 
+            display: flex;
 
+            flex-direction: column;
 
+            align-items: center;
 
+            justify-content: center;
 
+            text-align: center;
 
+            gap: 12px;
 
+            padding: 20px;
 
+        }
 
+
 
+        .upload-inner img {
 
+            width: 100%;
 
+            height: 100%;
 
+            object-fit: cover;
 
+        }
 
+
 
+        .upload-icon {
 
+            width: 68px;
 
+            height: 68px;
 
+            border-radius: 22px;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            background: var(--brand-red-soft);
 
+            color: var(--brand-red);
 
+            font-size: 36px;
 
+        }
 
+
 
+        .upload-title {
 
+            margin: 0;
 
+            font-size: 18px;
 
+            font-weight: 800;
 
+        }
 
+
 
+        .upload-desc {
 
+            margin: 0;
 
+            color: var(--text-secondary);
 
+            font-size: 14px;
 
+            line-height: 1.7;
 
+        }
 
+
 
+        .updatePrompt {
 
+            margin-top: 24px;
 
+            width: 100%;
 
+        }
 
+
 
+        .prompt-box {
 
+            max-width: 520px;
 
+            margin: 0 auto;
 
+            padding: 18px 20px;
 
+            border-radius: var(--radius-lg);
 
+            border: 1px solid rgba(235, 63, 87, .18);
 
+            background: var(--brand-red-soft);
 
+            color: var(--text-secondary);
 
+            display: flex;
 
+            align-items: flex-start;
 
+            gap: 12px;
 
+            line-height: 1.8;
 
+            font-size: 14px;
 
+        }
 
+
 
+        .prompt-box i {
 
+            color: var(--brand-red);
 
+            font-size: 20px;
 
+            margin-top: 2px;
 
+        }
 
+
 
+        .card-footer {
 
+            padding: 0 34px 38px;
 
+            display: flex;
 
+            justify-content: center;
 
+        }
 
+
 
+        .submit-btn.el-button--danger {
 
+            min-width: 240px;
 
+            height: 52px;
 
+            border: none;
 
+            border-radius: 999px;
 
+            font-size: 16px;
 
+            font-weight: 800;
 
+            background:
 
+                linear-gradient(135deg,
 
+                    var(--brand-red),
 
+                    var(--brand-red-dark));
 
+            box-shadow: var(--shadow-red);
 
+            transition:
 
+                transform .22s ease,
 
+                box-shadow .22s ease;
 
+        }
 
+
 
+        .submit-btn.el-button--danger:hover,
 
+        .submit-btn.el-button--danger:focus {
 
+            transform: translateY(-2px);
 
+            box-shadow:
 
+                0 18px 38px rgba(235, 63, 87, .34);
 
+        }
 
+
 
+        .el-dropdown-menu {
 
+            border-radius: 14px;
 
+            overflow: hidden;
 
+        }
 
+
 
+        @media (max-width: 768px) {
 
+            .upload-page {
 
+                padding: 14px;
 
+                align-items: flex-start;
 
+            }
 
+
 
+            .upload-card {
 
+                border-radius: 24px;
 
+            }
 
+
 
+            .card-header {
 
+                padding: 24px 18px;
 
+            }
 
+
 
+            .header-top {
 
+                flex-direction: column;
 
+                align-items: flex-start;
 
+            }
 
+
 
+            .language-switch {
 
+                width: 100%;
 
+                justify-content: center;
 
+            }
 
+
 
+            .title-text h1 {
 
+                font-size: 24px;
 
+            }
 
+
 
+            .card-body {
 
+                padding: 28px 18px;
 
+            }
 
+
 
+            .upload-box .el-upload {
 
+                height: 220px;
 
+                border-radius: 20px;
 
+            }
 
+
 
+            .card-footer {
 
+                padding: 0 18px 28px;
 
+            }
 
+
 
+            .submit-btn.el-button--danger {
 
+                width: 100%;
 
+            }
 
+        }
 
+    </style>
 
+</head>
 
+
 
+<body>
 
+
 
+    <div class="container" id="index">
 
+
 
+        <div class="upload-page">
 
+
 
+            <div class="upload-card">
 
+
 
+                <div class="card-header">
 
+
 
+                    <div class="header-top">
 
+
 
+                        <div class="title-group">
 
+
 
+                            <div class="title-icon">
 
+                                <i class="el-icon-postcard"></i>
 
+                            </div>
 
+
 
+                            <div class="title-text">
 
+                                <h1>{{lang.item1}}</h1>
 
+                            </div>
 
+
 
+                        </div>
 
+
 
+                        <div class="language-switch chooseLang">
 
+                            <el-dropdown trigger="click" @command="chooseLang">
 
+                                <span class="menu">
 
+                                    {{langList[language]}}
 
+                                    <i class="el-icon-arrow-down el-icon--right"></i>
 
+                                </span>
 
+
 
+                                <el-dropdown-menu slot="dropdown">
 
+                                    <el-dropdown-item command="en">English</el-dropdown-item>
 
+                                    <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                                </el-dropdown-menu>
 
+                            </el-dropdown>
 
+                        </div>
 
+                    </div>
 
+                    <div class="format-badges">
 
+                        <span class="format-badge">JPEG</span>
 
+                        <span class="format-badge">JPG</span>
 
+                        <span class="format-badge">PNG</span>
 
+                        <span class="format-badge">PDF</span>
 
+                    </div>
 
+                </div>
 
+                <div class="card-body">
 
+                    <el-upload class="avatar-uploader upload-box" :action="imgUrl + '/custom/bank/upload'"
 
+                        :headers="AccessToken" :show-file-list="false" :on-success="handleAvatarSuccess1"
 
+                        :before-upload="beforeAvatarUpload">
 
+                        <div class="upload-inner">
 
+                            <img v-if="imageUrl" :src="imageUrl" class="avatar" />
 
+                            <template v-else>
 
+                                <div class="upload-icon">
 
+                                    <i class="el-icon-picture-outline"></i>
 
+                                </div>
 
+                                <h3 class="upload-title">
 
+                                    {{lang.item1}}
 
+                                </h3>
 
+                                <p class="upload-desc">
 
+                                    JPEG/
 
+                                    JPG/
 
+                                    PNG/
 
+                                    PDF/
 
+                                </p>
 
+                            </template>
 
+                        </div>
 
+                    </el-upload>
 
+                    <div class="updatePrompt">
 
+                        <div class="prompt-box">
 
+                            <i class="el-icon-warning-outline"></i>
 
+                            <span>
 
+                                {{lang.UpdatePrompt}}
 
+                            </span>
 
+                        </div>
 
+                    </div>
 
+                </div>
 
+                <div class="card-footer">
 
+                    <el-button type="danger" class="submit-btn" @click="update">
 
+                        {{lang.btn}}
 
+                    </el-button>
 
+                </div>
 
+            </div>
 
+        </div>
 
+    </div>
 
+
 
+    <script src="js/vue.min.js"></script>
 
+    <script src="js/axios.min.js"></script>
 
+    <script src="js/element-ui.js"></script>
 
+    <script src="js/element@2.12.2.js"></script>
 
+    <script src="js/bank.js"></script>
 
+
 
+</body>
 
+
 
+</html>

+ 514 - 0
vu/forget.html
Visa fil 

@@ -0,0 +1,514 @@
 
+<!doctype html>
 
+<html lang="en">
 
+
 
+<head>
 
+  <meta charset="UTF-8" />
 
+  <title>Forget</title>
 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 
+  <meta name="full-screen" content="yes" />
 
+  <meta name="x5-fullscreen" content="true" />
 
+  <meta name="viewport"
 
+    content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+  <link rel="stylesheet" href="css/element-ui.css" />
 
+  <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+  <link rel="stylesheet" href="css/index.css" />
 
+
 
+  <style>
 
+    :root {
 
+      --primary: #2563eb;
 
+      --danger: #ef4444;
 
+      --danger-dark: #dc2626;
 
+      --primary-dark: #1d4ed8;
 
+      --primary-soft: #eff6ff;
 
+      --success: #16a34a;
 
+      --success-soft: #ecfdf3;
 
+      --text-main: #0f172a;
 
+      --text-secondary: #475569;
 
+      --text-muted: #94a3b8;
 
+      --border: #e2e8f0;
 
+      --border-strong: #cbd5e1;
 
+      --bg-page: #f4f7fb;
 
+      --bg-card: rgba(255, 255, 255, 0.94);
 
+      --radius-lg: 28px;
 
+      --radius-md: 20px;
 
+      --radius-sm: 14px;
 
+      --shadow-card: 0 24px 70px rgba(15, 23, 42, 0.08),
 
+        0 4px 18px rgba(15, 23, 42, 0.05);
 
+      --shadow-hover: 0 16px 40px rgba(37, 99, 235, 0.16);
 
+    }
 
+
 
+    * {
 
+      box-sizing: border-box;
 
+    }
 
+
 
+    html,
 
+    body {
 
+      min-height: 100%;
 
+    }
 
+
 
+    body {
 
+      margin: 0;
 
+      background:
 
+        radial-gradient(circle at top left, rgba(37, 99, 235, 0.13), transparent 32%),
 
+        radial-gradient(circle at top right, rgba(14, 165, 233, 0.13), transparent 34%),
 
+        var(--bg-page);
 
+      font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
 
+        "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
 
+      color: var(--text-main);
 
+      -webkit-font-smoothing: antialiased;
 
+    }
 
+
 
+    img {
 
+      display: block;
 
+      max-width: 100%;
 
+    }
 
+
 
+    .container {
 
+      width: 100%;
 
+    }
 
+
 
+    .page-shell {
 
+      width: 100%;
 
+      min-height: 100vh;
 
+      padding: 32px 20px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+    }
 
+
 
+    .auth-card {
 
+      width: min(960px, 100%);
 
+      min-height: 620px;
 
+      display: grid;
 
+      grid-template-columns: 0.95fr 1.05fr;
 
+      overflow: hidden;
 
+      border-radius: var(--radius-lg);
 
+      border: 1px solid rgba(255, 255, 255, 0.78);
 
+      background: var(--bg-card);
 
+      box-shadow: var(--shadow-card);
 
+      backdrop-filter: blur(18px);
 
+    }
 
+
 
+    .auth-visual {
 
+      position: relative;
 
+      padding: 34px;
 
+      color: #fff;
 
+      overflow: hidden;
 
+      background:
 
+        linear-gradient(135deg, rgba(37, 99, 235, 0.96), rgba(14, 165, 233, 0.92)),
 
+        #2563eb;
 
+    }
 
+
 
+    .auth-visual::before,
 
+    .auth-visual::after {
 
+      content: "";
 
+      position: absolute;
 
+      border-radius: 999px;
 
+      background: rgba(255, 255, 255, 0.14);
 
+    }
 
+
 
+    .auth-visual::before {
 
+      width: 260px;
 
+      height: 260px;
 
+      left: -90px;
 
+      bottom: -90px;
 
+    }
 
+
 
+    .auth-visual::after {
 
+      width: 180px;
 
+      height: 180px;
 
+      right: -58px;
 
+      top: 72px;
 
+    }
 
+
 
+    .visual-content {
 
+      position: relative;
 
+      z-index: 1;
 
+      height: 100%;
 
+      display: flex;
 
+      flex-direction: column;
 
+      justify-content: space-between;
 
+    }
 
+
 
+    .brand-logo {
 
+      width: 150px;
 
+      max-height: 72px;
 
+      object-fit: contain;
 
+      border-radius: 18px;
 
+      background: rgba(255, 255, 255, 1);
 
+      padding: 12px;
 
+      box-shadow: 0 16px 36px rgba(15, 23, 42, 0.14);
 
+    }
 
+
 
+    .visual-main {
 
+      margin-top: 80px;
 
+    }
 
+
 
+    .visual-icon {
 
+      width: 58px;
 
+      height: 58px;
 
+      display: inline-flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      border-radius: 20px;
 
+      font-size: 30px;
 
+      background: rgba(255, 255, 255, 0.16);
 
+      border: 1px solid rgba(255, 255, 255, 0.22);
 
+      backdrop-filter: blur(12px);
 
+    }
 
+
 
+    .visual-title {
 
+      margin: 24px 0 0;
 
+      font-size: 32px;
 
+      line-height: 1.16;
 
+      font-weight: 850;
 
+      letter-spacing: -0.04em;
 
+    }
 
+
 
+    .visual-desc {
 
+      margin: 16px 0 0;
 
+      max-width: 320px;
 
+      color: rgba(255, 255, 255, 0.82);
 
+      font-size: 15px;
 
+      line-height: 1.75;
 
+    }
 
+
 
+    .security-note {
 
+      margin-top: 34px;
 
+      padding: 16px;
 
+      border-radius: 18px;
 
+      background: rgba(255, 255, 255, 0.14);
 
+      border: 1px solid rgba(255, 255, 255, 0.18);
 
+      backdrop-filter: blur(12px);
 
+      font-size: 13px;
 
+      line-height: 1.6;
 
+      color: rgba(255, 255, 255, 0.84);
 
+    }
 
+
 
+    .auth-panel {
 
+      position: relative;
 
+      padding: 30px 42px 38px;
 
+      background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
 
+    }
 
+
 
+    .top-action {
 
+      display: flex;
 
+      justify-content: flex-end;
 
+      margin-bottom: 42px;
 
+    }
 
+
 
+    .lang-switch {
 
+      display: inline-flex;
 
+      align-items: center;
 
+      gap: 8px;
 
+      padding: 10px 12px;
 
+      border: 1px solid var(--border);
 
+      border-radius: 999px;
 
+      background: #fff;
 
+      box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
 
+    }
 
+
 
+    .lang-switch img {
 
+      width: 18px;
 
+      height: 12px;
 
+      object-fit: cover;
 
+      border-radius: 2px;
 
+    }
 
+
 
+    .lang-switch .menu {
 
+      color: var(--text-main);
 
+      font-size: 14px;
 
+      font-weight: 650;
 
+      cursor: pointer;
 
+    }
 
+
 
+    .mobile-logo {
 
+      display: none;
 
+      width: 160px;
 
+      border-radius: 16px;
 
+    }
 
+
 
+    .form-heading {
 
+      margin-bottom: 26px;
 
+      text-align: left;
 
+    }
 
+
 
+    .form-heading h1 {
 
+      margin: 0;
 
+      color: var(--text-main);
 
+      font-size: 28px;
 
+      line-height: 1.2;
 
+      font-weight: 850;
 
+      letter-spacing: -0.035em;
 
+    }
 
+
 
+    .form-heading p {
 
+      margin: 10px 0 0;
 
+      color: var(--text-secondary);
 
+      font-size: 14px;
 
+      line-height: 1.7;
 
+    }
 
+
 
+    .form {
 
+      width: 100%;
 
+      max-width: 450px;
 
+      margin: 0 auto;
 
+    }
 
+
 
+    .form .el-form-item {
 
+      margin-bottom: 18px;
 
+    }
 
+
 
+    .form .el-form-item:nth-child(2) {
 
+      margin-bottom: 12px;
 
+    }
 
+
 
+    .m-input .el-input__inner {
 
+      height: 52px;
 
+      padding-left: 16px;
 
+      padding-right: 44px;
 
+      border-radius: 16px;
 
+      border: 1px solid var(--border);
 
+      color: var(--text-main);
 
+      font-size: 15px;
 
+      background: #fff;
 
+      transition: border-color 0.22s ease, box-shadow 0.22s ease;
 
+    }
 
+
 
+    .m-input .el-input__inner:focus {
 
+      border-color: var(--primary);
 
+      box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.1);
 
+    }
 
+
 
+    .m-input .el-input__inner::placeholder {
 
+      color: var(--text-muted);
 
+    }
 
+
 
+    .m-input .el-input__suffix {
 
+      right: 12px;
 
+    }
 
+
 
+    .pwd {
 
+      margin: 6px 0 4px;
 
+      padding: 16px 18px 16px 38px;
 
+      border-radius: 18px;
 
+      border: 1px solid var(--border);
 
+      background: #fff;
 
+      text-align: left;
 
+    }
 
+
 
+    .pwd li {
 
+      position: relative;
 
+      list-style-type: disc;
 
+      line-height: 1.7;
 
+      color: var(--text-muted);
 
+      font-size: 13px;
 
+      transition: color 0.22s ease;
 
+    }
 
+
 
+    .pwd .fit {
 
+      color: var(--success);
 
+      font-weight: 650;
 
+    }
 
+
 
+    .pwd .fit::marker {
 
+      color: var(--success);
 
+    }
 
+
 
+    .s-btn.el-button--primary {
 
+      width: 100%;
 
+      height: 52px;
 
+      border: none;
 
+      border-radius: 999px;
 
+      font-size: 16px;
 
+      font-weight: 800;
 
+      background: linear-gradient(135deg, var(--danger), var(--danger-dark));
 
+      box-shadow: 0 14px 30px rgba(239, 68, 68, 0.28);
 
+      transition: transform 0.22s ease, box-shadow 0.22s ease;
 
+      transition: transform 0.22s ease, box-shadow 0.22s ease;
 
+    }
 
+
 
+    .s-btn.el-button--primary:hover,
 
+    .s-btn.el-button--primary:focus {
 
+      transform: translateY(-2px);
 
+      box-shadow: var(--shadow-hover);
 
+    }
 
+
 
+    .el-form-item__error {
 
+      padding-top: 6px;
 
+      font-size: 12px;
 
+    }
 
+
 
+    .el-dropdown-menu {
 
+      border-radius: 14px;
 
+      overflow: hidden;
 
+    }
 
+
 
+    .el-button,
 
+    .el-input__inner,
 
+    .el-textarea__inner {
 
+      font-family: inherit;
 
+    }
 
+
 
+    @media (max-width: 900px) {
 
+      .page-shell {
 
+        align-items: flex-start;
 
+        padding: 22px 14px;
 
+      }
 
+
 
+      .auth-card {
 
+        grid-template-columns: 1fr;
 
+        min-height: auto;
 
+      }
 
+
 
+      .auth-visual {
 
+        display: none;
 
+      }
 
+
 
+      .auth-panel {
 
+        padding: 24px 24px 32px;
 
+      }
 
+
 
+      .top-action {
 
+        margin-bottom: 22px;
 
+      }
 
+
 
+      .mobile-logo {
 
+        display: block;
 
+      }
 
+
 
+      .form-heading {
 
+        text-align: center;
 
+      }
 
+    }
 
+
 
+    @media (max-width: 540px) {
 
+      .page-shell {
 
+        padding: 12px;
 
+      }
 
+
 
+      .auth-card {
 
+        border-radius: 22px;
 
+      }
 
+
 
+      .auth-panel {
 
+        padding: 20px 16px 26px;
 
+      }
 
+
 
+      .top-action {
 
+        justify-content: space-between;
 
+      }
 
+
 
+      .lang-switch {
 
+        /* width: 100%; */
 
+        justify-content: flex-end;
 
+      }
 
+
 
+      .form-heading h1 {
 
+        font-size: 23px;
 
+      }
 
+
 
+      .form-heading p {
 
+        font-size: 13px;
 
+      }
 
+
 
+      .m-input .el-input__inner,
 
+      .s-btn.el-button--primary {
 
+        height: 50px;
 
+      }
 
+
 
+      .pwd {
 
+        padding: 14px 14px 14px 32px;
 
+        border-radius: 16px;
 
+      }
 
+    }
 
+  </style>
 
+</head>
 
+
 
+<body>
 
+  <div class="container" id="forget">
 
+    <div class="page-shell">
 
+      <div class="auth-card">
 
+        <aside class="auth-visual">
 
+          <div class="visual-content">
 
+            <img class="brand-logo" src="img/logo.jpg" alt="Logo" />
 
+
 
+            <div class="visual-main">
 
+              <div class="visual-icon">
 
+                <i class="el-icon-lock"></i>
 
+              </div>
 
+              <h1 class="visual-title">{{lang.item1}}</h1>
 
+              <p class="visual-desc">
 
+                {{lang.item6}}
 
+              </p>
 
+            </div>
 
+
 
+            <div class="security-note">
 
+              {{lang.item7}}
 
+            </div>
 
+          </div>
 
+        </aside>
 
+
 
+        <main class="auth-panel">
 
+          <div class="top-action">
 
+            <img class="mobile-logo" src="img/logo.jpg" alt="Logo" />
 
+            <div class="lang-switch chooseLang">
 
+              <!-- <img v-if="langList[language] == 'ENGLISH'" src="img/EN.jpg" alt="English" />
 
+              <img v-if="langList[language] == '中文简体'" src="img/CN.jpg" alt="中文简体" /> -->
 
+              <el-dropdown trigger="click" @command="chooseLang">
 
+                <span class="menu">
 
+                  {{langList[language]}}
 
+                  <i class="el-icon-arrow-down el-icon--right"></i>
 
+                </span>
 
+                <el-dropdown-menu slot="dropdown">
 
+                  <el-dropdown-item command="en">English</el-dropdown-item>
 
+                  <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                </el-dropdown-menu>
 
+              </el-dropdown>
 
+            </div>
 
+          </div>
 
+
 
+
 
+
 
+          <div class="form-heading">
 
+            <h1>{{lang.item1}}</h1>
 
+            <p>{{lang.item8}}</p>
 
+          </div>
 
+
 
+          <el-form :model="params" :rules="rules" ref="params" label-width="0" class="form">
 
+            <el-form-item prop="password">
 
+              <el-input show-password class="m-input" v-model="params.password" :placeholder="lang.item3"></el-input>
 
+            </el-form-item>
 
+
 
+            <el-form-item prop="password1">
 
+              <el-input show-password class="m-input" v-model="params.password1" :placeholder="lang.item4"></el-input>
 
+            </el-form-item>
 
+
 
+            <el-form-item>
 
+              <ul class="pwd">
 
+                <li :class="{ fit: rule1 }">{{lang.st1}}</li>
 
+                <li :class="{ fit: rule2 }">{{lang.st2}}</li>
 
+                <li :class="{ fit: rule3 }">{{lang.st3}}</li>
 
+              </ul>
 
+            </el-form-item>
 
+
 
+            <el-form-item>
 
+              <el-button type="primary" class="s-btn" @click="send">
 
+                {{lang.btn}}
 
+              </el-button>
 
+            </el-form-item>
 
+          </el-form>
 
+        </main>
 
+      </div>
 
+    </div>
 
+  </div>
 
+
 
+  <script src="js/vue.min.js"></script>
 
+  <script src="js/axios.min.js"></script>
 
+  <script src="js/element-ui.js"></script>
 
+  <script src="js/element@2.12.2.js"></script>
 
+  <script src="js/forget.js"></script>
 
+</body>
 
+
 
+</html>

+ 702 - 0
vu/info.html
Visa fil 

@@ -0,0 +1,702 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+  <meta charset="UTF-8" />
 
+  <title>Update</title>
 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 
+  <meta name="full-screen" content="yes" />
 
+  <meta name="x5-fullscreen" content="true" />
 
+  <meta name="viewport"
 
+    content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+  <link rel="stylesheet" href="css/element-ui.css" />
 
+  <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+  <link rel="stylesheet" href="css/index.css" />
 
+
 
+  <style>
 
+    :root {
 
+      --primary: #2563eb;
 
+      --primary-soft: #eff6ff;
 
+      --danger: #ef4444;
 
+      --danger-dark: #dc2626;
 
+      --success: #16a34a;
 
+      --text-main: #0f172a;
 
+      --text-secondary: #475569;
 
+      --text-muted: #94a3b8;
 
+      --border: #e2e8f0;
 
+      --border-strong: #cbd5e1;
 
+      --bg-page: #f4f7fb;
 
+      --bg-card: rgba(255, 255, 255, 0.94);
 
+      --bg-section: #f8fafc;
 
+      --radius-lg: 28px;
 
+      --radius-md: 20px;
 
+      --radius-sm: 14px;
 
+      --shadow-card: 0 24px 70px rgba(15, 23, 42, 0.08),
 
+        0 4px 18px rgba(15, 23, 42, 0.05);
 
+      --shadow-hover: 0 16px 40px rgba(37, 99, 235, 0.14);
 
+    }
 
+
 
+    * {
 
+      box-sizing: border-box;
 
+    }
 
+
 
+    html,
 
+    body {
 
+      min-height: 100%;
 
+    }
 
+
 
+    body {
 
+      margin: 0;
 
+      background:
 
+        radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 32%),
 
+        radial-gradient(circle at top right, rgba(14, 165, 233, 0.12), transparent 34%),
 
+        var(--bg-page);
 
+      font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
 
+        "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
 
+      color: var(--text-main);
 
+      -webkit-font-smoothing: antialiased;
 
+    }
 
+
 
+    img {
 
+      display: block;
 
+      max-width: 100%;
 
+    }
 
+
 
+    .container {
 
+      width: 100%;
 
+    }
 
+
 
+    .page-shell {
 
+      width: 100%;
 
+      min-height: 100vh;
 
+      padding: 32px 20px;
 
+      display: flex;
 
+      justify-content: center;
 
+    }
 
+
 
+    .document-card {
 
+      width: min(1080px, 100%);
 
+      background: var(--bg-card);
 
+      border: 1px solid rgba(255, 255, 255, 0.78);
 
+      border-radius: var(--radius-lg);
 
+      box-shadow: var(--shadow-card);
 
+      backdrop-filter: blur(18px);
 
+      overflow: hidden;
 
+    }
 
+
 
+    .hero-header {
 
+      padding: 30px 34px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: space-between;
 
+      gap: 20px;
 
+      background: linear-gradient(135deg, #ffffff 0%, #f8fbff 100%);
 
+      border-bottom: 1px solid var(--border);
 
+    }
 
+
 
+    .hero-title-group {
 
+      display: flex;
 
+      align-items: flex-start;
 
+      gap: 16px;
 
+    }
 
+
 
+    .hero-icon {
 
+      width: 48px;
 
+      height: 48px;
 
+      flex: 0 0 auto;
 
+      border-radius: 16px;
 
+      display: inline-flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      color: var(--primary);
 
+      background: var(--primary-soft);
 
+      font-size: 24px;
 
+    }
 
+
 
+    .hero-title {
 
+      margin: 0;
 
+      font-size: 28px;
 
+      line-height: 1.2;
 
+      font-weight: 800;
 
+      letter-spacing: -0.03em;
 
+    }
 
+
 
+    .hero-subtitle {
 
+      margin: 8px 0 0;
 
+      color: var(--text-secondary);
 
+      font-size: 14px;
 
+      line-height: 1.6;
 
+    }
 
+
 
+    .format-badges {
 
+      display: flex;
 
+      flex-wrap: wrap;
 
+      gap: 8px;
 
+      margin-top: 12px;
 
+    }
 
+
 
+    .format-badge {
 
+      padding: 5px 10px;
 
+      border-radius: 999px;
 
+      background: #fff;
 
+      border: 1px solid var(--border);
 
+      color: var(--text-secondary);
 
+      font-size: 12px;
 
+      font-weight: 600;
 
+    }
 
+
 
+    .lang-switch {
 
+      flex: 0 0 auto;
 
+      display: inline-flex;
 
+      align-items: center;
 
+      gap: 8px;
 
+      padding: 10px 12px;
 
+      border: 1px solid var(--border);
 
+      border-radius: 999px;
 
+      background: #fff;
 
+      box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
 
+    }
 
+
 
+    .lang-switch img {
 
+      width: 18px;
 
+      height: 12px;
 
+      object-fit: cover;
 
+      border-radius: 2px;
 
+    }
 
+
 
+    .lang-switch .menu {
 
+      color: var(--text-main);
 
+      font-size: 14px;
 
+      font-weight: 600;
 
+      cursor: pointer;
 
+    }
 
+
 
+    .content-info {
 
+      padding: 30px 34px 36px;
 
+    }
 
+
 
+    .section-card {
 
+      margin-bottom: 24px;
 
+      padding: 24px;
 
+      border-radius: var(--radius-md);
 
+      border: 1px solid var(--border);
 
+      background: linear-gradient(180deg, #ffffff 0%, var(--bg-section) 100%);
 
+    }
 
+
 
+    .section-header {
 
+      display: flex;
 
+      align-items: center;
 
+      gap: 14px;
 
+      margin-bottom: 22px;
 
+    }
 
+
 
+    .section-header-icon {
 
+      width: 38px;
 
+      height: 38px;
 
+      border-radius: 13px;
 
+      display: inline-flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      color: var(--primary);
 
+      background: var(--primary-soft);
 
+      font-size: 20px;
 
+    }
 
+
 
+    .section-title-wrap {
 
+      flex: 1;
 
+      min-width: 0;
 
+    }
 
+
 
+    .section-title {
 
+      margin: 0;
 
+      font-size: 18px;
 
+      line-height: 1.35;
 
+      font-weight: 750;
 
+      color: var(--text-main);
 
+    }
 
+
 
+    .section-description {
 
+      margin: 6px 0 0;
 
+      color: var(--text-secondary);
 
+      font-size: 14px;
 
+      line-height: 1.55;
 
+    }
 
+
 
+    .upload-grid {
 
+      display: grid;
 
+      grid-template-columns: repeat(2, minmax(0, 1fr));
 
+      gap: 18px;
 
+    }
 
+
 
+    .upload-grid.single {
 
+      grid-template-columns: minmax(0, 1fr);
 
+    }
 
+
 
+    .upload-box {
 
+      width: 100%;
 
+    }
 
+
 
+    .upload-box .el-upload {
 
+      position: relative;
 
+      width: 100%;
 
+      height: 190px;
 
+      border: 2px dashed var(--border-strong);
 
+      border-radius: 18px;
 
+      background: #fff;
 
+      overflow: hidden;
 
+      cursor: pointer;
 
+      transition: border-color 0.22s ease, box-shadow 0.22s ease,
 
+        transform 0.22s ease, background-color 0.22s ease;
 
+    }
 
+
 
+    .upload-box .el-upload:hover {
 
+      border-color: var(--primary);
 
+      background: #f8fbff;
 
+      box-shadow: var(--shadow-hover);
 
+      transform: translateY(-2px);
 
+    }
 
+
 
+    .upload-inner {
 
+      width: 100%;
 
+      height: 100%;
 
+      display: flex;
 
+      flex-direction: column;
 
+      align-items: center;
 
+      justify-content: center;
 
+      gap: 10px;
 
+      padding: 18px;
 
+      text-align: center;
 
+    }
 
+
 
+    .upload-inner .avatar {
 
+      width: 100%;
 
+      height: 100%;
 
+      object-fit: cover;
 
+    }
 
+
 
+    .upload-preview {
 
+      width: 100%;
 
+      height: 100%;
 
+    }
 
+
 
+    .upload-placeholder-icon {
 
+      width: 56px;
 
+      height: 56px;
 
+      border-radius: 18px;
 
+      display: inline-flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      color: var(--primary);
 
+      background: var(--primary-soft);
 
+      font-size: 30px;
 
+    }
 
+
 
+    .upload-placeholder-title {
 
+      margin: 0;
 
+      color: var(--text-main);
 
+      font-size: 15px;
 
+      font-weight: 700;
 
+    }
 
+
 
+    .upload-placeholder-text {
 
+      margin: 0;
 
+      color: var(--text-muted);
 
+      font-size: 13px;
 
+      line-height: 1.45;
 
+    }
 
+
 
+    .pdf-preview {
 
+      width: 100%;
 
+      height: 100%;
 
+      display: flex;
 
+      flex-direction: column;
 
+      align-items: center;
 
+      justify-content: center;
 
+      gap: 10px;
 
+      color: var(--primary);
 
+      background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
 
+    }
 
+
 
+    .pdf-preview i {
 
+      font-size: 36px;
 
+    }
 
+
 
+    .pdf-preview span {
 
+      font-size: 14px;
 
+      font-weight: 700;
 
+    }
 
+
 
+    .file-upload-action {
 
+      display: flex;
 
+      flex-wrap: wrap;
 
+      align-items: center;
 
+      gap: 12px;
 
+      margin-bottom: 16px;
 
+      justify-content: center;
 
+    }
 
+
 
+    .file-upload-action .el-button--primary {
 
+      height: 42px;
 
+      padding: 0 20px;
 
+      border-radius: 999px;
 
+      border: none;
 
+      font-weight: 700;
 
+      background: var(--primary);
 
+      box-shadow: 0 10px 22px rgba(37, 99, 235, 0.2);
 
+    }
 
+
 
+    .other-files-grid {
 
+      display: grid;
 
+      grid-template-columns: repeat(3, minmax(0, 1fr));
 
+      gap: 14px;
 
+    }
 
+
 
+    .file-card .el-upload {
 
+      height: 140px;
 
+    }
 
+
 
+    .submit-area {
 
+      position: sticky;
 
+      bottom: 0;
 
+      z-index: 2;
 
+      display: flex;
 
+      justify-content: center;
 
+      padding: 22px 0 0;
 
+      background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .9) 34%);
 
+    }
 
+
 
+    .submit-area .el-button--danger {
 
+      min-width: 240px;
 
+      height: 50px;
 
+      border: none;
 
+      border-radius: 999px;
 
+      font-size: 16px;
 
+      font-weight: 800;
 
+      background: linear-gradient(135deg, var(--danger), var(--danger-dark));
 
+      box-shadow: 0 14px 30px rgba(239, 68, 68, 0.28);
 
+      transition: transform 0.22s ease, box-shadow 0.22s ease;
 
+    }
 
+
 
+    .submit-area .el-button--danger:hover,
 
+    .submit-area .el-button--danger:focus {
 
+      transform: translateY(-2px);
 
+      box-shadow: 0 18px 38px rgba(239, 68, 68, 0.34);
 
+    }
 
+
 
+    .el-dropdown-menu {
 
+      border-radius: 14px;
 
+      overflow: hidden;
 
+    }
 
+
 
+    .el-button,
 
+    .el-input__inner,
 
+    .el-textarea__inner {
 
+      font-family: inherit;
 
+    }
 
+
 
+    @media (max-width: 900px) {
 
+      .page-shell {
 
+        padding: 22px 14px;
 
+      }
 
+
 
+      .hero-header,
 
+      .content-info {
 
+        padding-left: 24px;
 
+        padding-right: 24px;
 
+      }
 
+
 
+      .other-files-grid {
 
+        grid-template-columns: repeat(2, minmax(0, 1fr));
 
+      }
 
+    }
 
+
 
+    @media (max-width: 720px) {
 
+      .page-shell {
 
+        padding: 12px;
 
+      }
 
+
 
+      .document-card {
 
+        border-radius: 22px;
 
+      }
 
+
 
+      .hero-header {
 
+        padding: 22px 18px;
 
+        flex-direction: column;
 
+        align-items: stretch;
 
+      }
 
+
 
+      .hero-title-group {
 
+        gap: 12px;
 
+      }
 
+
 
+      .hero-icon {
 
+        width: 42px;
 
+        height: 42px;
 
+        border-radius: 14px;
 
+        font-size: 21px;
 
+      }
 
+
 
+      .hero-title {
 
+        font-size: 22px;
 
+      }
 
+
 
+      .lang-switch {
 
+        width: 100%;
 
+        justify-content: center;
 
+      }
 
+
 
+      .content-info {
 
+        padding: 20px 16px 24px;
 
+      }
 
+
 
+      .section-card {
 
+        padding: 18px;
 
+        border-radius: 18px;
 
+      }
 
+
 
+      .section-header {
 
+        align-items: flex-start;
 
+        margin-bottom: 18px;
 
+      }
 
+
 
+      .section-title {
 
+        font-size: 16px;
 
+      }
 
+
 
+      .section-description {
 
+        font-size: 13px;
 
+      }
 
+
 
+      .upload-grid,
 
+      .other-files-grid {
 
+        grid-template-columns: 1fr;
 
+      }
 
+
 
+      .upload-box .el-upload {
 
+        height: 156px;
 
+        border-radius: 16px;
 
+      }
 
+
 
+      .file-card .el-upload {
 
+        height: 132px;
 
+      }
 
+
 
+      .submit-area .el-button--danger {
 
+        width: 100%;
 
+        min-width: 0;
 
+      }
 
+    }
 
+
 
+    @media (max-width: 380px) {
 
+      .hero-title-group {
 
+        flex-direction: column;
 
+      }
 
+
 
+      .format-badges {
 
+        gap: 6px;
 
+      }
 
+
 
+      .format-badge {
 
+        font-size: 11px;
 
+      }
 
+    }
 
+  </style>
 
+</head>
 
+
 
+<body>
 
+  <div class="container" id="index">
 
+    <div class="page-shell">
 
+      <div class="document-card">
 
+        <header class="hero-header">
 
+          <div class="hero-title-group">
 
+            <div class="hero-icon">
 
+              <i class="el-icon-postcard"></i>
 
+            </div>
 
+            <div>
 
+              <h1 class="hero-title">{{lang.item1}}</h1>
 
+              <!-- <p class="hero-subtitle">Please upload clear and valid document images or PDF files.</p> -->
 
+              <div class="format-badges">
 
+                <span class="format-badge">JPEG</span>
 
+                <span class="format-badge">JPG</span>
 
+                <span class="format-badge">PNG</span>
 
+                <span class="format-badge">PDF</span>
 
+              </div>
 
+            </div>
 
+          </div>
 
+
 
+          <div class="lang-switch chooseLang">
 
+            <!-- <img
 
+                v-if="langList[language] == 'ENGLISH'"
 
+                src="img/EN.jpg"
 
+                alt="English"
 
+              />
 
+              <img
 
+                v-if="langList[language] == '中文简体'"
 
+                src="img/CN.jpg"
 
+                alt="中文简体"
 
+              /> -->
 
+            <el-dropdown trigger="click" @command="chooseLang">
 
+              <span class="menu">
 
+                {{langList[language]}}
 
+                <i class="el-icon-arrow-down el-icon--right"></i>
 
+              </span>
 
+              <el-dropdown-menu slot="dropdown">
 
+                <el-dropdown-item command="en">English</el-dropdown-item>
 
+                <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+              </el-dropdown-menu>
 
+            </el-dropdown>
 
+          </div>
 
+        </header>
 
+
 
+        <main class="content-info">
 
+          <section class="section-card">
 
+            <div class="section-header">
 
+              <div class="section-header-icon">
 
+                <i class="el-icon-document"></i>
 
+              </div>
 
+              <div class="section-title-wrap">
 
+                <h2 class="section-title">{{lang.item2}}</h2>
 
+                <p class="section-description"> {{lang.item6}}</p>
 
+              </div>
 
+            </div>
 
+
 
+            <div class="upload-grid">
 
+              <el-upload class="avatar-uploader upload-box" action="''" :http-request="handleUploadID1"
 
+                :headers="AccessToken" :disabled="fileListID1.status == 2 ? true : false" :show-file-list="false"
 
+                :on-success="handleAvatarSuccess1" :before-upload="beforeAvatarUpload">
 
+                <div class="upload-inner">
 
+                  <img
 
+                    v-if="(fileListID1.againPath && (fileListID1.againPath.substr(-3,3) != 'pdf' && fileListID1.againPath.substr(-3,3) != 'PDF')) || (fileListID1.path && (fileListID1.path.substr(-3,3) != 'pdf' && fileListID1.path.substr(-3,3) != 'PDF'))"
 
+                    :src="imgUrl+(fileListID1.againPath || fileListID1.path)" class="avatar" />
 
+                  <div class="pdf-preview"
 
+                    v-else-if="(fileListID1.againPath && (fileListID1.againPath.substr(-3,3) == 'pdf' || fileListID1.againPath.substr(-3,3) == 'PDF')) || (fileListID1.path && (fileListID1.path.substr(-3,3) == 'pdf' || fileListID1.path.substr(-3,3) == 'PDF'))">
 
+                    <i class="el-icon-document"></i>
 
+                    <span>PDF</span>
 
+                  </div>
 
+                  <template v-else>
 
+                    <div class="upload-placeholder-icon">
 
+                      <i class="el-icon-picture-outline"></i>
 
+                    </div>
 
+                    <p class="upload-placeholder-title">{{lang.item5}}</p>
 
+                  </template>
 
+                </div>
 
+              </el-upload>
 
+
 
+              <el-upload class="avatar-uploader upload-box" action="''" :http-request="handleUploadID2"
 
+                :headers="AccessToken" :disabled="fileListID2.status == 2 ? true : false" :show-file-list="false"
 
+                :on-success="handleAvatarSuccess2" :before-upload="beforeAvatarUpload">
 
+                <div class="upload-inner">
 
+                  <img
 
+                    v-if="(fileListID2.againPath && (fileListID2.againPath.substr(-3,3) != 'pdf' && fileListID2.againPath.substr(-3,3) != 'PDF')) || (fileListID2.path && (fileListID2.path.substr(-3,3) != 'pdf' && fileListID2.path.substr(-3,3) != 'PDF'))"
 
+                    :src="imgUrl+(fileListID2.againPath || fileListID2.path)" class="avatar" />
 
+                  <div class="pdf-preview"
 
+                    v-else-if="(fileListID2.againPath && (fileListID2.againPath.substr(-3,3) == 'pdf' || fileListID2.againPath.substr(-3,3) == 'PDF')) || (fileListID2.path && (fileListID2.path.substr(-3,3) == 'pdf' || fileListID2.path.substr(-3,3) == 'PDF'))">
 
+                    <i class="el-icon-document"></i>
 
+                    <span>PDF</span>
 
+                  </div>
 
+                  <template v-else>
 
+                    <div class="upload-placeholder-icon">
 
+                      <i class="el-icon-picture-outline"></i>
 
+                    </div>
 
+                    <p class="upload-placeholder-title">{{lang.item5}}</p>
 
+                  </template>
 
+                </div>
 
+              </el-upload>
 
+            </div>
 
+          </section>
 
+
 
+          <section class="section-card">
 
+            <div class="section-header">
 
+              <div class="section-header-icon">
 
+                <i class="el-icon-document"></i>
 
+              </div>
 
+              <div class="section-title-wrap">
 
+                <h2 class="section-title">{{lang.item7}}</h2>
 
+                <p class="section-description">{{lang.item9}}</p>
 
+              </div>
 
+            </div>
 
+
 
+            <div class="upload-grid single">
 
+              <el-upload class="avatar-uploader upload-box" :action="''" :http-request="handleUploadAdd1"
 
+                :headers="AccessToken" :disabled="fileListAdd1.status == 2 ? true : false" :show-file-list="false"
 
+                :on-success="handleAvatarSuccess3" :before-upload="beforeAvatarUpload">
 
+                <div class="upload-inner">
 
+                  <img
 
+                    v-if="(fileListAdd1.againPath && (fileListAdd1.againPath.substr(-3,3) != 'pdf' && fileListAdd1.againPath.substr(-3,3) != 'PDF')) || (fileListAdd1.path && (fileListAdd1.path.substr(-3,3) != 'pdf' && fileListAdd1.path.substr(-3,3) != 'PDF'))"
 
+                    :src="imgUrl+(fileListAdd1.againPath || fileListAdd1.path)" class="avatar" />
 
+                  <div class="pdf-preview"
 
+                    v-else-if="(fileListAdd1.againPath && (fileListAdd1.againPath.substr(-3,3) == 'pdf' || fileListAdd1.againPath.substr(-3,3) == 'PDF')) || (fileListAdd1.path && (fileListAdd1.path.substr(-3,3) == 'pdf' || fileListAdd1.path.substr(-3,3) == 'PDF'))">
 
+                    <i class="el-icon-document"></i>
 
+                    <span>PDF</span>
 
+                  </div>
 
+                  <template v-else>
 
+                    <div class="upload-placeholder-icon">
 
+                      <i class="el-icon-picture-outline"></i>
 
+                    </div>
 
+                    <p class="upload-placeholder-title">{{lang.item8}}</p>
 
+                  </template>
 
+                </div>
 
+              </el-upload>
 
+            </div>
 
+          </section>
 
+
 
+          <section class="section-card">
 
+            <div class="section-header">
 
+              <div class="section-header-icon">
 
+                <i class="el-icon-folder-opened"></i>
 
+              </div>
 
+              <div class="section-title-wrap">
 
+                <h2 class="section-title">{{lang.item10}}</h2>
 
+                <p class="section-description">{{lang.item11}} {{lang.item12}}</p>
 
+              </div>
 
+            </div>
 
+
 
+            <div class="file-upload-action">
 
+              <el-upload class="avatar-uploaderOther fileOther" :action="''" :http-request="handleUploadOtherAdd"
 
+                :headers="AccessToken" :show-file-list="false" :on-success="handleAvatarSuccessOther"
 
+                :before-upload="beforeAvatarUpload">
 
+                <el-button type="primary">
 
+                  <i class="el-icon-upload"></i>
 
+                  <span>{{lang.Upload}}</span>
 
+                </el-button>
 
+              </el-upload>
 
+            </div>
 
+
 
+            <div class="other-files-grid">
 
+              <div id="files" v-for="(item,index) in fileListOthers" :key="index">
 
+                <el-upload class="avatar-uploaderOther fileOthers upload-box file-card"
 
+                  :action="imgUrl +'/custom/file/upload/10/' + item.id" :headers="AccessToken"
 
+                  :disabled="fileListOther.status == 2 ? true : false" :show-file-list="false"
 
+                  :on-success="handleAvatarSuccessOther" :before-upload="beforeAvatarUpload">
 
+                  <div class="upload-inner file">
 
+                    <img
 
+                      v-if="(item.againPath && (item.againPath.substr(-3,3) != 'pdf' && item.againPath.substr(-3,3) != 'PDF')) || (item.path && (item.path.substr(-3,3) != 'pdf' && item.path.substr(-3,3) != 'PDF'))"
 
+                      :src="imgUrl+(item.againPath || item.path)" class="avatar" />
 
+                    <div class="pdf-preview" v-else>
 
+                      <i class="el-icon-document"></i>
 
+                      <span>FILE</span>
 
+                    </div>
 
+                  </div>
 
+                </el-upload>
 
+              </div>
 
+            </div>
 
+          </section>
 
+
 
+          <div class="submit-area">
 
+            <el-button type="danger" @click="update">{{lang.btn}}</el-button>
 
+          </div>
 
+        </main>
 
+      </div>
 
+    </div>
 
+  </div>
 
+
 
+  <script src="js/vue.min.js"></script>
 
+  <script src="js/axios.min.js"></script>
 
+  <script src="js/element-ui.js"></script>
 
+  <script src="js/element@2.12.2.js"></script>
 
+  <script src="upload.js"></script>
 
+  <script src="info.js"></script>
 
+</body>
 
+
 
+</html>

+ 337 - 0
vu/info.js
Visa fil 

@@ -0,0 +1,337 @@
 
+// ES5 方式：通过全局变量使用 createUploadRequest（需要先加载 upload.js）
 
+
 
+var content = {
 
+  cn: {
 
+    item1: "文档管理",
 
+    item2: "身份证明",
 
+    item3: "未验证",
 
+    item4: "已通过",
 
+    item5: "护照/身份证/驾照。",
 
+    item6:
 
+      "请上传PNG、JPEG、JPG或PDF格式的彩色身份证明文件，显示您的全名。图像必须是高质量的，畅通无阻，并显示整个文档页面。如属国家身份证件，须上传身份证正反两面。文件有效期必须超过3个月。",
 
+    item7: "地址证明",
 
+    item8: "请以PNG、JPEG、JPG或PDF格式上传地址证明。",
 
+    item9:
 
+      "住址证明必须不超过180天(水电帐单/银行对账单/其他财务文件)。文件必须以申请人的姓名发出，并显示申请人在登记时所提供的目前居住地址。图像必须是高质量的，畅通无阻，并显示整个文档页面。",
 
+    item10: "其它补充材料",
 
+    item11: "护照/身份证/驾照。",
 
+    item12: "请上传我们支持团队要求的其他文件。",
 
+    IMG: "上传头像图片大小不能超过 3MB!",
 
+    JPG: "上传图片只能是 JPG、JPEG、PNG、PDF 格式!",
 
+    btn: "确认上传",
 
+    success: "上传成功，请在PC端查看...",
 
+    Upload: "上传文件",
 
+  },
 
+  en: {
 
+    item1: "Document management",
 
+    item2: "ID",
 
+    item3: "Not verified",
 
+    item4: "Passed",
 
+    item5: "Passport / ID card / driver's license.",
 
+    item6:
 
+      "Please upload your full name in PNG, JPEG, JPG or PDF format. Images must be high quality, unobstructed, and display the entire document page. If it is a national ID card, both sides of the ID card must be uploaded. Documents must be valid for more than 3 months.",
 
+    item7: "Proof of address",
 
+    item8:
 
+      "Please upload the address Certificate in PNG, JPEG, JPG or PDF format.",
 
+    item9:
 
+      "Proof of address must not exceed 180 days (water and electricity bill / bank statement / other financial documents). The document must be issued in the name of the applicant and show the current residential address provided by the applicant at the time of registration. Images must be high quality, unobstructed, and display the entire document page.",
 
+    item10: "Other supplementary materials",
 
+    item11: "Passport / ID card / driver's license.",
 
+    item12: "Please upload other documents as required by our support team.",
 
+    IMG: "The size of the uploaded picture cannot exceed 3MB!",
 
+    JPG: "Upload image can only be JPG, JPEG, PNG, PDF format!",
 
+    btn: "Confirm upload",
 
+    success: "Upload succeeded, please check on PC",
 
+    Upload: "Upload Files",
 
+  },
 
+};
 
+
 
+let vm = new Vue({
 
+  el: "#index",
 
+  data: {
 
+    //多语言
 
+    langList: {
 
+      en: "ENGLISH",
 
+      cn: "中文简体",
 
+    },
 
+    language: "cn",
 
+    lang: {},
 
+    imageUrl1: "",
 
+    imageUrl2: "",
 
+    imageUrl3: "",
 
+    imageUrl4: "",
 
+    imageUrl5: "",
 
+
 
+    //文件
 
+    fileListID1: {
 
+      againPath: "",
 
+      id: null,
 
+      path: "",
 
+      status: null,
 
+      type: null,
 
+    },
 
+    fileListID2: {
 
+      againPath: "",
 
+      id: null,
 
+      path: "",
 
+      status: null,
 
+      type: null,
 
+    },
 
+    fileListAdd1: {
 
+      againPath: "",
 
+      id: null,
 
+      path: "",
 
+      status: null,
 
+      type: null,
 
+    },
 
+    fileListAdd2: {
 
+      againPath: "",
 
+      id: null,
 
+      path: "",
 
+      status: null,
 
+      type: null,
 
+    },
 
+    fileListOthers: [],
 
+    fileListOther: {
 
+      againPath: "",
 
+      id: null,
 
+      path: "",
 
+      status: null,
 
+      type: null,
 
+    },
 
+    actionID1: "",
 
+    actionID2: "",
 
+    actionAdd1: "",
 
+    actionAdd2: "",
 
+    actionOtherAdd: "",
 
+    actionOther: "",
 
+
 
+    imgUrl: "",
 
+    ho: "",
 
+  },
 
+  computed: {
 
+    AccessToken() {
 
+      return {
 
+        "Access-Token": window.location.href.split("=")[1],
 
+      };
 
+    },
 
+  },
 
+  methods: {
 
+    // 语言切换函数
 
+    chooseLang(key) {
 
+      this.lang = content[key];
 
+      this.language = key;
 
+    },
 
+    //确认上传按钮
 
+    update() {
 
+      if (
 
+        !this.fileListID1.path &&
 
+        !this.fileListID2.path &&
 
+        !this.fileListAdd1.path &&
 
+        !this.fileListAdd2.path &&
 
+        !this.fileListOthers.length
 
+      ) {
 
+        return;
 
+      }
 
+      this.$message({
 
+        message: content[this.language].success,
 
+        type: "success",
 
+      });
 
+    },
 
+    //获取上传文件信息
 
+    async getCustomFileList() {
 
+      let _this = this;
 
+      axios.defaults.headers.common["Access-Token"] =
 
+        window.location.href.split("=")[1];
 
+      axios
 
+        .post(this.imgUrl + "/custom/file/list", {
 
+          //参数
 
+        })
 
+        .then((res) => {
 
+          //请求成功后的处理函数
 
+          if (res.data.code == 200) {
 
+            let myData = res.data.data;
 
+            this.fileListOthers = [];
 
+            myData.forEach((item) => {
 
+              if (item.type == 1) {
 
+                _this.fileListID1 = item;
 
+              } else if (item.type == 2) {
 
+                _this.fileListID2 = item;
 
+              } else if (item.type == 3) {
 
+                _this.fileListAdd1 = item;
 
+              } else if (item.type == 4) {
 
+                _this.fileListAdd2 = item;
 
+              } else if (item.type == 10) {
 
+                _this.fileListOthers.push(item);
 
+              }
 
+            });
 
+            this.actionType();
 
+          } 
+        })
 
+        .catch((err) => {
 
+          console.log(err)
 
+          //请求失败后的处理函数
 
+        });
 
+    },
 
+
 
+    //请求头
 
+    actionType() {
 
+      if (this.fileListID1.id) {
 
+        this.actionID1 =
 
+          this.imgUrl + "/custom/file/upload/1/" + this.fileListID1.id;
 
+      } else {
 
+        this.actionID1 = this.imgUrl + "/custom/file/upload/1";
 
+      }
 
+      if (this.fileListID2.id) {
 
+        this.actionID2 =
 
+          this.imgUrl + "/custom/file/upload/2/" + this.fileListID2.id;
 
+      } else {
 
+        this.actionID2 = this.imgUrl + "/custom/file/upload/2";
 
+      }
 
+      if (this.fileListAdd1.id) {
 
+        this.actionAdd1 =
 
+          this.imgUrl + "/custom/file/upload/3/" + this.fileListAdd1.id;
 
+      } else {
 
+        this.actionAdd1 = this.imgUrl + "/custom/file/upload/3";
 
+      }
 
+      if (this.fileListAdd2.id) {
 
+        this.actionAdd2 =
 
+          this.imgUrl + "/custom/file/upload/4/" + this.fileListAdd2.id;
 
+      } else {
 
+        this.actionAdd2 = this.imgUrl + "/custom/file/upload/4";
 
+      }
 
+
 
+      this.actionOtherAdd = this.imgUrl + "/custom/file/upload/10";
 
+    },
 
+
 
+    
+
 
+    // 自定义上传方法
 
+    handleUploadID1(options) {
 
+      const originalUrl =
 
+        this.actionID1 || this.imgUrl + "/custom/file/upload/1";
 
+      return createUploadRequest(originalUrl, this.AccessToken)(options);
 
+    },
 
+    handleUploadID2(options) {
 
+      const originalUrl =
 
+        this.actionID2 || this.imgUrl + "/custom/file/upload/2";
 
+      return createUploadRequest(originalUrl, this.AccessToken)(options);
 
+    },
 
+    handleUploadAdd1(options) {
 
+      const originalUrl =
 
+        this.actionAdd1 || this.imgUrl + "/custom/file/upload/3";
 
+      return createUploadRequest(originalUrl, this.AccessToken)(options);
 
+    },
 
+    handleUploadAdd2(options) {
 
+      const originalUrl =
 
+        this.actionAdd2 || this.imgUrl + "/custom/file/upload/4";
 
+      return createUploadRequest(originalUrl, this.AccessToken)(options);
 
+    },
 
+    handleUploadOtherAdd(options) {
 
+      const originalUrl =
 
+        this.actionOtherAdd || this.imgUrl + "/custom/file/upload/10";
 
+      return createUploadRequest(originalUrl, this.AccessToken)(options);
 
+    },
 
+    handleUploadOtherWithId(options, id) {
 
+      const originalUrl = this.imgUrl + "/custom/file/upload/10/" + id;
 
+      return createUploadRequest(originalUrl, this.AccessToken)(options);
 
+    },
 
+
 
+    //图片上传
 
+    beforeAvatarUpload(file) {
 
+      const imageType = ["image/jpeg", "image/png", "image/jpg", "image/pdf"];
 
+      const isJPG =
 
+        imageType.indexOf(file.type.toLocaleLowerCase()) == -1 ? false : true;
 
+      const isLt2M = file.size / 1024 / 1024 < 3;
 
+
 
+      if (!isJPG) {
 
+        this.$message.error(content[this.language].JPG);
 
+      }
 
+      if (!isLt2M) {
 
+        this.$message.error(content[this.language].IMG);
 
+      }
 
+      return isJPG && isLt2M;
 
+    },
 
+    handleAvatarSuccess1(res) {
 
+      if (res.code == 200) {
 
+        this.$message({
 
+          message: res.msg,
 
+          type: "success",
 
+        });
 
+        this.fileListID1.path = res.data.path;
 
+      } else {
 
+        this.$message.error(res.msg);
 
+      }
 
+    },
 
+    handleAvatarSuccess2(res) {
 
+      if (res.code == 200) {
 
+        this.$message({
 
+          message: res.msg,
 
+          type: "success",
 
+        });
 
+        this.fileListID2.path = res.data.path;
 
+      } else {
 
+        this.$message.error(res.msg);
 
+      }
 
+    },
 
+    handleAvatarSuccess3(res) {
 
+      if (res.code == 200) {
 
+        this.$message({
 
+          message: res.msg,
 
+          type: "success",
 
+        });
 
+        this.fileListAdd1.path = res.data.path;
 
+      } else {
 
+        this.$message.error(res.msg);
 
+      }
 
+    },
 
+    handleAvatarSuccess4(res) {
 
+      if (res.code == 200) {
 
+        this.$message({
 
+          message: res.msg,
 
+          type: "success",
 
+        });
 
+        this.fileListAdd2.path = res.data.path;
 
+      } else {
 
+        this.$message.error(res.msg);
 
+      }
 
+    },
 
+    handleAvatarSuccess5(res) {
 
+      if (res.code == 200) {
 
+        this.$message({
 
+          message: res.msg,
 
+          type: "success",
 
+        });
 
+        this.fileListOther.path = res.data.path;
 
+      } else {
 
+        this.$message.error(res.msg);
 
+      }
 
+    },
 
+    handleAvatarSuccessOther(res) {
 
+      if (res.code == 200) {
 
+        this.$message({
 
+          message: res.msg,
 
+          type: "success",
 
+        });
 
+        this.getCustomFileList();
 
+      } else {
 
+        this.$message.error(res.msg);
 
+      }
 
+    },
 
+  },
 
+  mounted() {
 
+    this.ho = window.location.host.split(".")[1];
 
+    this.imgUrl = "https://secure." + this.ho + ".com";
 
+    this.host05 = "https://file." + this.ho + ".com";
 
+    this.getCustomFileList();
 
+
 
+    var jsSrc = (navigator.language || navigator.browserLanguage).toLowerCase();
 
+    if (jsSrc.indexOf("zh") >= 0) {
 
+      this.language = "cn";
 
+      this.lang = content["cn"];
 
+    } else {
 
+      this.language = "en";
 
+      this.lang = content["en"];
 
+    }
 
+  },
 
+});

+ 457 - 0
vu/kycAuth.html
Visa fil 

@@ -0,0 +1,457 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+  <meta charset="UTF-8" />
 
+  <title>KYC Auth Status</title>
 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
+  <meta name="full-screen" content="yes">
 
+  <meta name="x5-fullscreen" content="true">
 
+
 
+  <link rel="stylesheet" href="css/element-ui.css" />
 
+  <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+
 
+  <style>
 
+    :root {
 
+      --primary: #ef4444;
 
+      --primary-dark: #dc2626;
 
+      --primary-soft: #fef2f2;
 
+      --blue: #368fec;
 
+      --text-main: #0f172a;
 
+      --text-secondary: #475569;
 
+      --text-muted: #94a3b8;
 
+      --border: #e2e8f0;
 
+      --bg-page: #f5f7fb;
 
+      --bg-card: rgba(255, 255, 255, .96);
 
+      --radius-xl: 30px;
 
+      --radius-lg: 22px;
 
+      --radius-md: 16px;
 
+      --shadow-card:
 
+        0 24px 70px rgba(15, 23, 42, .08),
 
+        0 6px 20px rgba(15, 23, 42, .05);
 
+    }
 
+
 
+    * {
 
+      box-sizing: border-box;
 
+    }
 
+
 
+    html,
 
+    body {
 
+      margin: 0;
 
+      min-height: 100%;
 
+      font-family:
 
+        Inter,
 
+        -apple-system,
 
+        BlinkMacSystemFont,
 
+        "Segoe UI",
 
+        sans-serif;
 
+      background:
 
+        radial-gradient(circle at top left, rgba(239, 68, 68, .12), transparent 32%),
 
+        radial-gradient(circle at top right, rgba(59, 130, 246, .12), transparent 30%),
 
+        var(--bg-page);
 
+      color: var(--text-main);
 
+      -webkit-font-smoothing: antialiased;
 
+    }
 
+
 
+    img {
 
+      display: block;
 
+      max-width: 100%;
 
+    }
 
+
 
+    a {
 
+      text-decoration: none;
 
+    }
 
+
 
+    #payment {
 
+      width: 100%;
 
+      min-height: 100vh;
 
+      padding: 30px 20px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+    }
 
+
 
+    .payment-wrapper {
 
+      width: min(760px, 100%);
 
+    }
 
+
 
+    .payment-card {
 
+      position: relative;
 
+      overflow: hidden;
 
+      border-radius: var(--radius-xl);
 
+      border: 1px solid rgba(255, 255, 255, .78);
 
+      background: var(--bg-card);
 
+      backdrop-filter: blur(16px);
 
+      box-shadow: var(--shadow-card);
 
+    }
 
+
 
+    /* .payment-card::before {
 
+      content: "";
 
+      position: absolute;
 
+      top: 0;
 
+      left: 0;
 
+      width: 100%;
 
+      height: 5px;
 
+      background: linear-gradient(90deg, var(--primary), var(--primary-dark));
 
+    } */
 
+
 
+    .card-header {
 
+      padding: 28px 34px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: space-between;
 
+      gap: 20px;
 
+      border-bottom: 1px solid var(--border);
 
+      background: linear-gradient(180deg, #ffffff 0%, #fafcff 100%);
 
+    }
 
+
 
+    .logo-box img {
 
+      width: 150px;
 
+      object-fit: contain;
 
+    }
 
+
 
+    .language-switch {
 
+      display: inline-flex;
 
+      align-items: center;
 
+      padding: 10px 14px;
 
+      border-radius: 999px;
 
+      border: 1px solid var(--border);
 
+      background: #fff;
 
+      box-shadow: 0 10px 22px rgba(15, 23, 42, .04);
 
+    }
 
+
 
+    .language-switch .menu {
 
+      font-size: 14px;
 
+      font-weight: 700;
 
+      color: var(--text-main);
 
+      cursor: pointer;
 
+    }
 
+
 
+    .card-body {
 
+      padding: 42px 34px;
 
+      text-align: center;
 
+    }
 
+
 
+    .status-image {
 
+      width: 120px;
 
+      height: 120px;
 
+      margin: 0 auto 28px;
 
+      border-radius: 50%;
 
+      background: var(--primary-soft);
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      padding: 24px;
 
+      box-shadow:
 
+        inset 0 0 0 10px rgba(239, 68, 68, .06),
 
+        0 20px 40px rgba(239, 68, 68, .12);
 
+    }
 
+
 
+    .status-image img {
 
+      width: 100%;
 
+    }
 
+
 
+    .status-title {
 
+      margin: 0;
 
+      font-size: 30px;
 
+      font-weight: 800;
 
+      letter-spacing: -.03em;
 
+      color: var(--text-main);
 
+    }
 
+
 
+    .status-description {
 
+      margin: 24px auto 0;
 
+      max-width: 520px;
 
+      font-size: 15px;
 
+      line-height: 2;
 
+      color: var(--text-secondary);
 
+    }
 
+
 
+    .status-description a {
 
+      color: var(--blue);
 
+      font-weight: 800;
 
+      text-decoration: underline;
 
+      transition: opacity .2s ease;
 
+    }
 
+
 
+    .status-description a:hover {
 
+      opacity: .8;
 
+    }
 
+
 
+    .spacer {
 
+      height: 24px;
 
+    }
 
+
 
+    .support-card {
 
+      margin-top: 38px;
 
+      padding: 24px;
 
+      border-radius: var(--radius-lg);
 
+      border: 1px solid var(--border);
 
+      background: linear-gradient(180deg, #fff 0%, #fafafa 100%);
 
+      display: flex;
 
+      align-items: center;
 
+      gap: 24px;
 
+      text-align: left;
 
+    }
 
+
 
+    .support-image {
 
+      width: 92px;
 
+      flex: 0 0 auto;
 
+    }
 
+
 
+    .support-text {
 
+      color: #64748b;
 
+      font-size: 13px;
 
+      line-height: 2;
 
+    }
 
+
 
+    .support-text span {
 
+      color: var(--blue);
 
+      font-weight: 700;
 
+      text-decoration: underline;
 
+    }
 
+
 
+    .footer-note {
 
+      margin-top: 34px;
 
+      padding-top: 28px;
 
+      border-top: 1px solid var(--border);
 
+      color: #94a3b8;
 
+      font-size: 12px;
 
+      line-height: 1.9;
 
+      text-align: left;
 
+    }
 
+
 
+    .footer-note strong {
 
+      color: #64748b;
 
+    }
 
+
 
+    .card-footer {
 
+      margin-top: 28px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: space-between;
 
+      gap: 18px;
 
+      flex-wrap: wrap;
 
+    }
 
+
 
+    .footer-title {
 
+      font-size: 13px;
 
+      font-weight: 800;
 
+      color: var(--text-main);
 
+    }
 
+
 
+    .social-list {
 
+      display: flex;
 
+      align-items: center;
 
+      flex-wrap: wrap;
 
+      gap: 12px;
 
+    }
 
+
 
+    .social-item {
 
+      width: 42px;
 
+      height: 42px;
 
+      border-radius: 14px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      background: #fff;
 
+      border: 1px solid var(--border);
 
+      transition:
 
+        transform .22s ease,
 
+        box-shadow .22s ease,
 
+        border-color .22s ease;
 
+    }
 
+
 
+    .social-item:hover {
 
+      transform: translateY(-2px);
 
+      border-color: rgba(239, 68, 68, .4);
 
+      box-shadow: 0 14px 30px rgba(239, 68, 68, .12);
 
+    }
 
+
 
+    .social-item img {
 
+      width: 20px;
 
+      height: 20px;
 
+      object-fit: contain;
 
+    }
 
+
 
+    .el-dropdown-menu {
 
+      border-radius: 14px;
 
+      overflow: hidden;
 
+    }
 
+
 
+    @media (max-width: 768px) {
 
+      #payment {
 
+        padding: 14px;
 
+        align-items: flex-start;
 
+      }
 
+
 
+
 
+      .payment-card {
 
+        border-radius: 24px;
 
+      }
 
+
 
+      .card-header {
 
+        padding: 22px 18px;
 
+      }
 
+
 
+      .language-switch {
 
+        justify-content: center;
 
+      }
 
+
 
+      .card-body {
 
+        padding: 30px 18px;
 
+      }
 
+
 
+      .status-image {
 
+        width: 96px;
 
+        height: 96px;
 
+        margin-bottom: 24px;
 
+      }
 
+
 
+      .status-title {
 
+        font-size: 24px;
 
+      }
 
+
 
+      .status-description {
 
+        font-size: 14px;
 
+        line-height: 1.8;
 
+      }
 
+
 
+      .support-card {
 
+        flex-direction: column;
 
+        text-align: center;
 
+        padding: 20px;
 
+      }
 
+
 
+      .footer-note {
 
+        text-align: center;
 
+      }
 
+
 
+      .card-footer {
 
+        justify-content: center;
 
+      }
 
+
 
+      .footer-title {
 
+        width: 100%;
 
+        text-align: center;
 
+      }
 
+    }
 
+  </style>
 
+</head>
 
+
 
+<body>
 
+  <div id="payment">
 
+    <div class="payment-wrapper">
 
+      <div class="payment-card">
 
+
 
+        <header class="card-header">
 
+          <div class="logo-box">
 
+            <img src="img/logo.jpg" alt="logo" />
 
+          </div>
 
+
 
+          <div class="language-switch">
 
+            <el-dropdown trigger="click" @command="chooseLang">
 
+              <span class="menu language-box">
 
+                {{langList[language]}}
 
+                <i class="el-icon-arrow-down el-icon--right"></i>
 
+              </span>
 
+
 
+              <el-dropdown-menu slot="dropdown">
 
+                <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                <el-dropdown-item command="zhHant">中文繁体</el-dropdown-item>
 
+                <el-dropdown-item command="en">English</el-dropdown-item>
 
+                <el-dropdown-item command="vn">Tiếng Việt</el-dropdown-item>
 
+                <el-dropdown-item command="de">Deutsch</el-dropdown-item>
 
+                <el-dropdown-item command="es">Español</el-dropdown-item>
 
+                <el-dropdown-item command="id">Indonesian</el-dropdown-item>
 
+                <el-dropdown-item command="ms">Melayu</el-dropdown-item>
 
+                <el-dropdown-item command="th">ภาษาไทย</el-dropdown-item>
 
+                <el-dropdown-item command="ar">العربية</el-dropdown-item>
 
+                <el-dropdown-item command="ko">한국어</el-dropdown-item>
 
+                <el-dropdown-item command="pt">Português</el-dropdown-item>
 
+                <el-dropdown-item command="fa">زبان پارسی</el-dropdown-item>
 
+                <el-dropdown-item command="tr">Türkçe</el-dropdown-item>
 
+              </el-dropdown-menu>
 
+            </el-dropdown>
 
+          </div>
 
+        </header>
 
+
 
+        <main class="card-body">
 
+          <!-- <div class="status-image">
 
+            <img src="img/wait.png" alt="" />
 
+          </div> -->
 
+
 
+          <h1 class="status-title">
 
+            {{lang.item1}}
 
+          </h1>
 
+
 
+          <div class="status-description">
 
+            {{lang.item2}}
 
+            <a :href="'https://secure.' + ho + '.com/'">
 
+              {{lang.item3}}
 
+            </a>
 
+            {{lang.item4}}
 
+          </div>
 
+
 
+          <div class="spacer"></div>
 
+
 
+          <div class="support-card">
 
+            <!-- <div class="support-image">
 
+              <img src="img/kf.png" alt="" />
 
+            </div> -->
 
+
 
+            <div class="support-text">
 
+              {{lang.item5}}
 
+              <span>{{lang.item6}}</span>
 
+              {{lang.item7}}
 
+              <span>{{lang.item8}}</span>
 
+              {{lang.item9}}
 
+            </div>
 
+          </div>
 
+
 
+          <div class="footer-note">
 
+            <strong>{{lang.item10}}</strong>
 
+            {{lang.item11}}
 
+          </div>
 
+
 
+          <div class="card-footer">
 
+            <div class="footer-title">
 
+              {{lang.item12}}
 
+            </div>
 
+
 
+            <div class="social-list">
 
+              <a class="social-item1"
 
+                href="https://www.youtube.com/channel/UCsezhM2kqgoJ5s4wyU2XFqw?view_as=subscriber">
 
+                <!-- <img src="img/1.png" alt="" /> -->
 
+              </a>
 
+
 
+              <a class="social-item1" href="https://www.facebook.com/cwgmarkets-113157100404084/">
 
+                <!-- <img src="img/2.png" alt="" /> -->
 
+              </a>
 
+
 
+              <a class="social-item1" href="https://www.linkedin.com/company/20863443">
 
+                <!-- <img src="img/3.png" alt="" /> -->
 
+              </a>
 
+
 
+              <a class="social-item1" href="https://instagram.com/cwgmarkets?igshid=5o01ctz1iser">
 
+                <!-- <img src="img/4.png" alt="" /> -->
 
+              </a>
 
+
 
+              <a class="social-item1" href="https://twitter.com/MarketsCwg">
 
+                <!-- <img src="img/5.png" alt="" /> -->
 
+              </a>
 
+            </div>
 
+          </div>
 
+        </main>
 
+      </div>
 
+    </div>
 
+  </div>
 
+
 
+  <script src="js/vue.min.js"></script>
 
+  <script src="js/axios.min.js"></script>
 
+  <script src="js/element-ui.js"></script>
 
+  <script src="js/element@2.12.2.js"></script>
 
+  <script src="kycAuth.js"></script>
 
+</body>
 
+
 
+</html>

+ 301 - 0
vu/kycAuth.js
Visa fil 

@@ -0,0 +1,301 @@
 
+var content = {
 
+  'cn':{
 
+    item1:'人脸认证确认中...',
 
+    item2:'人脸认证正在确认中，具体信息以',
 
+    item3:'个人专区',
 
+    item4:'中的状态为准。',
 
+    item5:'若有任何疑问或帮助，请致电',
 
+    item6:'400 842 4626',
 
+    item7:'或发送邮件至',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'与我们联系。我们的客服支持团队期待您的垂询。',
 
+    item10:'一般风险警告：',
 
+    item11:'差价合约 (CFD) 是杠杆产品。差价合约(CFD)交易存在较高风险，因此可能不适用于所有投资人。投资价值既可能增加也可能减少，而且投资人可能损失他们所有的投资。在任何情况下，本公司对任何个人或实体由差价合约(CFD)交易造成的或产生的或关联的全部或部分损失或损害，都不承担任何责任。',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'en':{
 
+    item1:'Face authentication confirming...',
 
+    item2:'Face authentication is being confirmed, specific information is subject to',
 
+    item3:'Personal Area',
 
+    item4:'orders.',
 
+    item5:'If you have any questions or need assistance, please call',
 
+    item6:'400 842 4626',
 
+    item7:'or email',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'to contact us. Our customer support team looks forward to your inquiry.',
 
+    item10:'General Risk Warning:',
 
+    item11:'Contracts for Difference (CFDs) are leveraged products. CFD trading carries a high level of risk and may not be suitable for all investors. The value of investments can both increase and decrease, and investors may lose all their invested capital. In any case, the Company shall not be liable for any loss or damage, in whole or in part, arising from or related to Contracts for Difference (CFD) trading incurred or incurred by any individual or entity.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'zhHant':{
 
+    item1:'人臉認證確認中...',
 
+    item2:'人臉認證正在確認中，具體信息以',
 
+    item3:'個人專區',
 
+    item4:'中的訂單為準。 ',
 
+    item5:'若有任何疑問或幫助，請致電',
 
+    item6:'400 842 4626',
 
+    item7:'或寄郵件至',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'與我們聯絡。我們的客服支援團隊期待您的詢問。 ',
 
+    item10:'一般風險警告：',
 
+    item11:'差價合約 (CFD) 是槓桿產品。差價合約(CFD)交易有較高風險，因此可能不適用於所有投資人。投資價值既可能增加也可能減少，投資人可能損失他們所有的投資。在任何情況下，本公司對任何個人或實體由差價合約(CFD)交易造成的或產生的或關聯的全部或部分損失或損害，都不承擔任何責任。 ',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'vn':{
 
+    item1: "Đang xác nhận nhận dạng khuôn mặt...",
 
+    item2: "Đang xác nhận nhận dạng khuôn mặt, thông tin cụ thể sẽ được thông báo sau.",
 
+    item3:'Khu vực cá nhân',
 
+    item4:'đơn hàng.',
 
+    item5:'Nếu bạn có bất kỳ câu hỏi hoặc cần hỗ trợ, vui lòng gọi',
 
+    item6:'400 842 4626',
 
+    item7:'hoặc email',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'để liên hệ với chúng tôi. Đội ngũ hỗ trợ khách hàng của chúng tôi rất mong đợi sự truy vấn của bạn.',
 
+    item10:'Cảnh báo Rủi ro Tổng quan:',
 
+    item11:'Hợp đồng Chênh lệch (CFDs) là các sản phẩm ký quỹ. Giao dịch CFD mang mức độ rủi ro cao và có thể không phù hợp cho tất cả các nhà đầu tư. Giá trị của các khoản đầu tư có thể tăng lên và giảm đi, và các nhà đầu tư có thể mất toàn bộ vốn đầu tư của họ. Trong mọi trường hợp, Công ty sẽ không chịu trách nhiệm cho bất kỳ tổn thất hoặc thiệt hại, toàn bộ hoặc một phần, phát sinh từ hoặc liên quan đến việc giao dịch Hợp đồng Chênh lệch (CFD) bị gây ra hoặc phát sinh bởi bất kỳ cá nhân hoặc thực thể nào.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'de':{
 
+    item1: "Gesichtserkennung wird bestätigt...",
 
+    item2: "Die Gesichtserkennung wird bestätigt, weitere Informationen werden nachgereicht.",
 
+    item1:'Zahlungsauftrag bestätigen...',
 
+    item2:'Der Zahlungsauftrag wird bestätigt, spezifische Informationen unterliegen',
 
+    item3:'dem persönlichen Bereich',
 
+    item4:'Bestellungen.',
 
+    item5:'Wenn Sie Fragen haben oder Unterstützung benötigen, rufen Sie bitte an',
 
+    item6:'400 842 4626',
 
+    item7:'oder E-Mail',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'um uns zu kontaktieren. Unser Kundensupport-Team freut sich auf Ihre Anfrage.',
 
+    item10:'Allgemeine Risikowarnung:',
 
+    item11:'Differenzkontrakte (CFDs) sind gehebelte Produkte. Der Handel mit CFDs birgt ein hohes Risiko und ist möglicherweise nicht für alle Anleger geeignet. Der Wert von Investitionen kann sowohl steigen als auch fallen, und Anleger können ihr gesamtes investiertes Kapital verlieren. In jedem Fall haftet das Unternehmen nicht für Verluste oder Schäden, ganz oder teilweise, die sich aus oder im Zusammenhang mit dem Handel mit Differenzkontrakten (CFD) ergeben oder entstanden sind, die von einer Einzelperson oder Einrichtung erlitten wurden oder entstanden sind.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'es':{
 
+    item1: "Confirmación de reconocimiento facial en curso...",
 
+    item2: "El reconocimiento facial está siendo confirmado, los detalles se proporcionarán más tarde.",
 
+    item3:'el Área Personal',
 
+    item4:'órdenes.',
 
+    item5:'Si tiene alguna pregunta o necesita ayuda, llame al',
 
+    item6:'400 842 4626',
 
+    item7:'o envíe un correo electrónico a',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'para contactarnos. Nuestro equipo de soporte al cliente espera su consulta.',
 
+    item10:'Advertencia de Riesgo General:',
 
+    item11:'Los Contratos por Diferencia (CFDs) son productos apalancados. El trading de CFD conlleva un alto nivel de riesgo y puede no ser adecuado para todos los inversores. El valor de las inversiones puede tanto aumentar como disminuir, y los inversores pueden perder todo su capital invertido. En cualquier caso, la Empresa no será responsable de ninguna pérdida o daño, en su totalidad o en parte, derivados o relacionados con la negociación de Contratos por Diferencia (CFD) incurridos o sufridos por cualquier individuo o entidad.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'id':{
 
+    item1: "Verifikasi wajah sedang dalam proses...",
 
+    item2: "Verifikasi wajah sedang dalam proses, informasi spesifik akan diinformasikan kemudian.",
 
+    item3:'Area Personal',
 
+    item4:'pesanan.',
 
+    item5:'Jika Anda memiliki pertanyaan atau membutuhkan bantuan, silakan hubungi',
 
+    item6:'400 842 4626',
 
+    item7:'atau email',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'untuk menghubungi kami. Tim dukungan pelanggan kami menantikan pertanyaan Anda.',
 
+    item10:'Peringatan Risiko Umum:',
 
+    item11:'Kontrak untuk Perbedaan (CFD) adalah produk berleveraj. Perdagangan CFD membawa tingkat risiko yang tinggi dan mungkin tidak cocok untuk semua investor. Nilai investasi dapat meningkat dan menurun, dan investor dapat kehilangan seluruh modal yang diinvestasikan. Dalam setiap kasus, Perusahaan tidak bertanggung jawab atas kerugian atau kerusakan, sebagian atau seluruhnya, yang timbul dari atau terkait dengan perdagangan Kontrak untuk Perbedaan (CFD) yang terjadi atau diderita oleh individu atau entitas mana pun.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'ms':{
 
+    item1: "Pengesahan pengenalan wajah sedang berlangsung...",
 
+    item2: "Pengenalan wajah sedang dalam proses pengesahan, maklumat spesifik akan diberitahu kemudian.",
 
+    item3:'Kawasan Peribadi',
 
+    item4:'pesanan.',
 
+    item5:'Jika anda mempunyai sebarang pertanyaan atau perlukan bantuan, sila hubungi',
 
+    item6:'400 842 4626',
 
+    item7:'atau e-mel',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'untuk menghubungi kami. Pasukan sokongan pelanggan kami mengharapkan pertanyaan anda.',
 
+    item10:'Amaran Risiko Am:',
 
+    item11:'Kontrak untuk Perbezaan (CFDs) adalah produk berleveraj. Perdagangan CFD membawa tahap risiko yang tinggi dan mungkin tidak sesuai untuk semua pelabur. Nilai pelaburan boleh meningkat dan menurun, dan pelabur boleh kehilangan semua modal yang dilaburkan. Dalam mana-mana kes, Syarikat tidak akan bertanggungjawab atas sebarang kerugian atau kerosakan, keseluruhannya atau sebahagiannya, yang timbul daripada atau berkaitan dengan perdagangan Kontrak untuk Perbezaan (CFD) yang ditanggung atau dialami oleh mana-mana individu atau entiti.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'th':{
 
+    item1: "กำลังยืนยันการรับรองใบหน้า...",
 
+    item2: "การรับรองใบหน้ากำลังดำเนินการอยู่ รายละเอียดจะแจ้งให้ทราบในภายหลัง",
 
+    item3:'พื้นที่ส่วนตัว',
 
+    item4:'รายการ',
 
+    item5:'หากคุณมีข้อสงสัยหรือต้องการความช่วยเหลือ โปรดโทร',
 
+    item6:'400 842 4626',
 
+    item7:'หรืออีเมล',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'เพื่อติดต่อเรา ทีมสนับสนุนลูกค้าของเรายินดีรับการสอบถามของคุณ',
 
+    item10:'คำเตือนเกี่ยวกับความเสี่ยงทั่วไป:',
 
+    item11:'สัญญาอัตราส่วนต่างๆ (CFDs) เป็นผลิตภัณฑ์ที่มีการยืมเงิน. การซื้อขาย CFDs มีความเสี่ยงสูงและอาจไม่เหมาะสำหรับนักลงทุนทุกคน. มูลค่าของการลงทุนสามารถเพิ่มขึ้นและลดลงได้ และนักลงทุนอาจสูญเสียทุกส่วนของเงินลงทุนของพวกเขา. ในทุกกรณี บริษัทจะไม่รับผิดชอบต่อความสูญเสียหรือความเสียหายใด ๆ ทั้งหมดหรือบางส่วนที่เกิดขึ้นจากหรือเกี่ยวข้องกับการซื้อขายสัญญาอัตราส่วนต่างๆ (CFD) ที่เกิดขึ้นหรือเกิดขึ้นโดยบุคคลหรือหน่วยงานใด ๆ',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'ar':{
 
+    item1: "جاري التحقق من التعرف على الوجه...",
 
+    item2: "جاري التحقق من التعرف على الوجه، سيتم إعلامك بالتفاصيل لاحقاً.",
 
+    item3:'المنطقة الشخصية',
 
+    item4:'الطلبات.',
 
+    item5:'إذا كان لديك أي أسئلة أو تحتاج إلى مساعدة ، يرجى الاتصال على',
 
+    item6:'400 842 4626',
 
+    item7:'أو البريد الإلكتروني',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'للتواصل معنا. يتطلع فريق دعم العملاء لدينا إلى استفسارك.',
 
+    item10:'تحذير المخاطر العام:',
 
+    item11:'العقود مقابل الفروقات (CFDs) هي منتجات رافعة مالية. تتضمن تداول CFD مستوى عالٍ من المخاطر وقد لا يكون مناسبًا لجميع المستثمرين. قد يزيد ويقلل قيمة الاستثمارات ، ويمكن للمستثمرين أن يخسروا رأس المال الذي استثمروه بالكامل. في أي حال من الأحوال ، لن تكون الشركة مسؤولة عن أي خسارة أو ضرر ، جزئيًا أو كليًا ، ناتجة عن أو متعلقة بتداول العقود مقابل الفروقات (CFD) التي يتكبدها أو تكبدها أي فرد أو كيان.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'ko':{
 
+    item1: "얼굴 인식 확인 중...",
 
+    item2: "얼굴 인식이 확인되고 있으며, 구체적인 정보는 나중에 안내됩니다.",
 
+    item3:'개인 영역',
 
+    item4:'주문.',
 
+    item5:'질문이 있거나 도움이 필요한 경우',
 
+    item6:'400 842 4626',
 
+    item7:'또는 이메일',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'로 연락하십시오. 저희에게 문의하시기 바랍니다. 저희 고객 지원 팀은 귀하의 문의를 기다리고 있습니다.',
 
+    item10:'일반 위험 경고:',
 
+    item11:'차이 계약 (CFDs)은 레버리지 상품입니다. CFD 거래는 높은 위험 수준을 내포하며 모든 투자자에게 적합하지 않을 수 있습니다. 투자 가치는 증가하거나 감소할 수 있으며, 투자자는 투자한 자본을 모두 잃을 수 있습니다. 어떤 경우에도 회사는 개인 또는 단체에 의해 발생하거나 발생하는 차이 계약 (CFD) 거래와 관련하여 발생하는 손실 또는 손해에 대해 전체 또는 일부로 책임을지지 않습니다.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'pt':{
 
+    item1: "Confirmação de reconhecimento facial em andamento...",
 
+    item2: "O reconhecimento facial está sendo confirmado, detalhes serão fornecidos posteriormente.",
 
+    item3:'a Área Pessoal',
 
+    item4:'encomendas.',
 
+    item5:'Se tiver alguma dúvida ou precisar de assistência, ligue para',
 
+    item6:'400 842 4626',
 
+    item7:'ou envie um email para',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'para nos contatar. A nossa equipe de suporte ao cliente aguarda o seu inquérito.',
 
+    item10:'Aviso de Risco Geral:',
 
+    item11:'Os Contratos por Diferença (CFDs) são produtos alavancados. A negociação de CFDs envolve um alto nível de risco e pode não ser adequada para todos os investidores. O valor dos investimentos pode tanto aumentar como diminuir, e os investidores podem perder todo o seu capital investido. Em qualquer caso, a Empresa não será responsável por qualquer perda ou dano, total ou parcial, decorrente ou relacionado à negociação de Contratos por Diferença (CFD) incorridos ou sofridos por qualquer indivíduo ou entidade.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'fa':{
 
+    item1: "در حال تأیید شناسایی چهره...",
 
+    item2: "شناسایی چهره در حال تأیید است، جزئیات لازم به اطلاع خواهد رسید.",
 
+    item3:'منطقه شخصی',
 
+    item4:'سفارشات.',
 
+    item5:'اگر سوالی دارید یا نیاز به کمک دارید، لطفاً تماس بگیرید',
 
+    item6:'400 842 4626',
 
+    item7:'یا ایمیل بزنید',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'برای تماس با ما. تیم پشتیبانی مشتری ما منتظر پرسش شماست.',
 
+    item10:'هشدار عمومی در مورد خطر:',
 
+    item11:'قراردادهای مختلف (CFDs) محصولات وام دار هستند. معامله CFD حاوی سطح بالایی از ریسک است و ممکن است برای همه سرمایه گذاران مناسب نباشد. ارزش سرمایه گذاری ها هم می تواند افزایش یابد و هم کاهش یابد و سرمایه گذاران ممکن است سرمایه گذاری خود را کاملاً از دست بدهند. در هر صورت، شرکت مسئول هیچ گونه زیان یا خسارت، کلی یا جزئی، ناشی از یا مربوط به معاملات قراردادهای مختلف (CFD) را که توسط هر فرد یا نهادی انجام شده یا تحمل شده است، نمی شود.',
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+  'tr':{
 
+    item1: "Yüz tanıma doğrulanıyor...",
 
+    item2: "Yüz tanımama doğrulanıyor, detaylar daha sonra bildirilecektir.",
 
+    item3:'Kişisel Alan',
 
+    item4:'siparişler.',
 
+    item5:'Herhangi bir sorunuz varsa veya yardıma ihtiyacınız varsa, lütfen arayın',
 
+    item6:'400 842 4626',
 
+    item7:'veya e-posta gönderin',
 
+    item8:'service@cwgmarkets.com',
 
+    item9:'ile iletişim kurmak için. Müşteri destek ekibimiz sorularınızı bekliyor.',
 
+    item10:'Genel Risk Uyarısı:',
 
+    item11:"Fark Sözleşmeleri (CFD'ler) kaldıraçlı ürünlerdir. CFD ticareti yüksek bir risk seviyesi taşır ve tüm yatırımcılar için uygun olmayabilir. Yatırımların değeri hem artabilir hem de azalabilir ve yatırımcılar tüm yatırılan sermayelerini kaybedebilirler. Her durumda, Şirket, Bireyler veya Kurumlar tarafından yapılan veya yaşanan Fark Sözleşmeleri (CFD) ticaretiyle ilgili olarak, tamamen veya kısmen kaynaklanan veya ilişkili olan herhangi bir kayıp veya hasar için sorumlu tutulamaz.",
 
+    item12:'www.cwgmarkets.com'
 
+  },
 
+}
 
+
 
+let vm = new Vue({
 
+    el: "#payment",
 
+    data: {
 
+      //多语言
 
+      langList: {
 
+        en: "ENGLISH",
 
+        cn: "中文简体",
 
+        zhHant: "中文繁體",
 
+        vn: "Tiếng Việt",
 
+        de: "Deutsch",
 
+        es: "Español",
 
+        id: "Indonesian",
 
+        ms: "Melayu",
 
+        th: "ภาษาไทย",
 
+        ar: "العربية",
 
+        ko: "한국어",
 
+        pt: "Português",
 
+        fa: "زبان پارسی",
 
+        tr: "Türkçe",
 
+      },
 
+      language: "cn",
 
+      lang:{},
 
+
 
+      imgUrl:'',
 
+      ho:''
 
+    },
 
+  computed: {
 
+    
+  },
 
+    methods: {
 
+      // 语言切换函数
 
+      chooseLang(key) {
 
+        this.lang = content[key];
 
+        this.language = key;
 
+        sessionStorage.setItem("lang", this.language);
 
+        location.reload();
 
+      },
 
+    },
 
+    mounted() {
 
+      this.ho = window.location.host.split('.')[1];
 
+
 
+      if (sessionStorage.getItem("lang")) {
 
+        this.language = sessionStorage.getItem("lang"),
 
+        this.lang = content[sessionStorage.getItem("lang")];
 
+      } else {
 
+  
+        var jsSrc =(navigator.language || navigator.browserLanguage);
 
+        // jsSrc = 'ko-IN'
 
+        if(jsSrc.indexOf('zh-C') >= 0){
 
+          this.language = 'cn'
 
+          this.lang = content['cn'];
 
+        }else if(jsSrc.indexOf('es') >= 0){
 
+          this.language = 'es'
 
+          this.lang = content['es'];
 
+        }else if(jsSrc.indexOf('zh-') >= 0){
 
+          this.language = 'zhHant'
 
+          this.lang = content['zhHant'];
 
+        }else if(jsSrc.indexOf('ar') >= 0){
 
+          this.language = 'ar'
 
+          this.lang = content['ar'];
 
+        }else if(jsSrc.indexOf('de') >= 0){
 
+          this.language = 'de'
 
+          this.lang = content['de'];
 
+        }else if(jsSrc.indexOf('id') >= 0){
 
+          this.language = 'id'
 
+          this.lang = content['id'];
 
+        }else if(jsSrc.indexOf('ko') >= 0 && jsSrc.indexOf('kok') == -1){
 
+          this.language = 'ko'
 
+          this.lang = content['ko'];
 
+        }else if(jsSrc.indexOf('ms') >= 0){
 
+          this.language = 'ms'
 
+          this.lang = content['ms'];
 
+        }else if(jsSrc.indexOf('th') >= 0){
 
+          this.language = 'th'
 
+          this.lang = content['th'];
 
+        }else if(jsSrc.indexOf('vi') >= 0){
 
+          this.language = 'vn'
 
+          this.lang = content['vn'];
 
+        }else if(jsSrc.indexOf('fa') >= 0){
 
+          this.language = 'fa'
 
+          this.lang = content['fa'];
 
+        }else if(jsSrc.indexOf('pt') >= 0){
 
+          this.language = 'pt'
 
+          this.lang = content['pt'];
 
+        }else if(jsSrc.indexOf('tr') >= 0){
 
+          this.language = 'tr'
 
+          this.lang = content['tr'];
 
+        }else{
 
+          this.language = 'en'
 
+          this.lang = content['en'];
 
+        }
 
+  
+        // this.language = 'en'
 
+        // this.lang = content['en'];
 
+  
+        sessionStorage.setItem("lang", this.language);
 
+      }
 
+
 
+    }
 
+});

+ 288 - 0
vu/maintenance.html
Visa fil 

@@ -0,0 +1,288 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8" />
 
+    <title>CWG Markets System Maintenance Notice</title>
 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
+    <meta name="full-screen" content="yes">
 
+    <meta name="x5-fullscreen" content="true">
 
+    <meta name="viewport"
 
+        content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+    <link rel="stylesheet" href="css/element-ui.css" />
 
+
 
+    <style>
 
+        :root {
 
+            --brand-red: #eb3f57;
 
+            --brand-red-dark: #d92f48;
 
+            --brand-red-soft: #fff1f3;
 
+            --text-main: #111827;
 
+            --text-secondary: #4b5563;
 
+            --text-muted: #9ca3af;
 
+            --border: #e5e7eb;
 
+            --card-bg: rgba(255, 255, 255, .96);
 
+            --page-bg: #f5f7fb;
 
+            --radius-xl: 30px;
 
+            --radius-lg: 22px;
 
+            --shadow-card:
 
+                0 24px 70px rgba(17, 24, 39, .08),
 
+                0 6px 20px rgba(17, 24, 39, .05);
 
+        }
 
+
 
+        * {
 
+            box-sizing: border-box;
 
+        }
 
+
 
+        body {
 
+            margin: 0;
 
+            min-height: 100vh;
 
+            background:
 
+                radial-gradient(circle at top left, rgba(235, 63, 87, .12), transparent 32%),
 
+                radial-gradient(circle at top right, rgba(59, 130, 246, .1), transparent 30%),
 
+                var(--page-bg);
 
+            font-family:
 
+                Inter,
 
+                -apple-system,
 
+                BlinkMacSystemFont,
 
+                "Segoe UI",
 
+                sans-serif;
 
+            color: var(--text-main);
 
+            -webkit-font-smoothing: antialiased;
 
+        }
 
+
 
+        img {
 
+            display: block;
 
+            max-width: 100%;
 
+        }
 
+
 
+        .container {
 
+            width: 100%;
 
+        }
 
+
 
+        .maintenance-page {
 
+            width: 100%;
 
+            min-height: 100vh;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            padding: 32px 20px;
 
+        }
 
+
 
+        .maintenance-card {
 
+            width: min(760px, 100%);
 
+            overflow: hidden;
 
+            border-radius: var(--radius-xl);
 
+            border: 1px solid rgba(255, 255, 255, .75);
 
+            background: var(--card-bg);
 
+            backdrop-filter: blur(18px);
 
+            box-shadow: var(--shadow-card);
 
+        }
 
+
 
+        .maintenance-header {
 
+            padding: 28px 32px;
 
+            background:
 
+                linear-gradient(135deg,
 
+                    var(--brand-red),
 
+                    var(--brand-red-dark));
 
+            color: #fff;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            gap: 12px;
 
+            font-size: 20px;
 
+            font-weight: 800;
 
+            letter-spacing: -.02em;
 
+        }
 
+
 
+        .maintenance-body {
 
+            padding: 48px 42px;
 
+            text-align: center;
 
+        }
 
+
 
+        .logo-box img {
 
+            width: 180px;
 
+            margin: 0 auto 34px;
 
+        }
 
+
 
+        .icon-wrap {
 
+            width: 120px;
 
+            height: 120px;
 
+            margin: 0 auto 28px;
 
+            border-radius: 50%;
 
+            background: var(--brand-red-soft);
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            box-shadow:
 
+                inset 0 0 0 10px rgba(235, 63, 87, .06),
 
+                0 20px 40px rgba(235, 63, 87, .12);
 
+        }
 
+
 
+        .icon-wrap i {
 
+            font-size: 54px;
 
+            color: var(--brand-red);
 
+        }
 
+
 
+        .main-title {
 
+            margin: 0;
 
+            font-size: 34px;
 
+            line-height: 1.2;
 
+            font-weight: 850;
 
+            letter-spacing: -.04em;
 
+        }
 
+
 
+        .description {
 
+            max-width: 620px;
 
+            margin: 26px auto 0;
 
+            color: var(--text-secondary);
 
+            font-size: 16px;
 
+            line-height: 2;
 
+        }
 
+
 
+        .tips-box {
 
+            margin-top: 36px;
 
+            padding: 22px;
 
+            border-radius: var(--radius-lg);
 
+            border: 1px solid var(--border);
 
+            background:
 
+                linear-gradient(180deg,
 
+                    #ffffff 0%,
 
+                    #fafafa 100%);
 
+            text-align: left;
 
+        }
 
+
 
+        .tips-title {
 
+            margin: 0 0 14px;
 
+            font-size: 15px;
 
+            font-weight: 800;
 
+        }
 
+
 
+        .tips-list {
 
+            margin: 0;
 
+            padding-left: 18px;
 
+        }
 
+
 
+        .tips-list li {
 
+            color: var(--text-secondary);
 
+            line-height: 1.9;
 
+            font-size: 14px;
 
+        }
 
+
 
+        .footer-note {
 
+            margin-top: 36px;
 
+            color: var(--text-muted);
 
+            font-size: 13px;
 
+        }
 
+
 
+        @media (max-width: 768px) {
 
+            .maintenance-page {
 
+                padding: 14px;
 
+                align-items: flex-start;
 
+            }
 
+
 
+            .maintenance-card {
 
+                border-radius: 24px;
 
+            }
 
+
 
+            .maintenance-header {
 
+                padding: 22px 18px;
 
+                font-size: 18px;
 
+            }
 
+
 
+            .maintenance-body {
 
+                padding: 32px 20px;
 
+            }
 
+
 
+            .logo-box img {
 
+                width: 150px;
 
+            }
 
+
 
+            .icon-wrap {
 
+                width: 96px;
 
+                height: 96px;
 
+            }
 
+
 
+            .icon-wrap i {
 
+                font-size: 44px;
 
+            }
 
+
 
+            .main-title {
 
+                font-size: 26px;
 
+            }
 
+
 
+            .description {
 
+                font-size: 14px;
 
+                line-height: 1.9;
 
+            }
 
+
 
+            .tips-box {
 
+                padding: 18px;
 
+            }
 
+        }
 
+    </style>
 
+</head>
 
+
 
+<body>
 
+
 
+    <div class="container">
 
+        <div class="maintenance-page">
 
+
 
+            <div class="maintenance-card">
 
+
 
+                <div class="maintenance-header">
 
+                    <i class="el-icon-warning-outline"></i>
 
+                    <span>System Maintenance</span>
 
+                </div>
 
+
 
+                <div class="maintenance-body">
 
+
 
+                    <div class="logo-box">
 
+                        <img src="img/logo.jpg" alt="Logo" />
 
+                    </div>
 
+
 
+                    <div class="icon-wrap">
 
+                        <i class="el-icon-setting"></i>
 
+                    </div>
 
+
 
+                    <h1 class="main-title">
 
+                        CWG Markets System Maintenance Notice
 
+                    </h1>
 
+
 
+                    <div class="description">
 
+                        To provide you with a better and more stable trading experience,
 
+                        CWG Markets is currently performing scheduled system maintenance.
 
+                        During this period, some services may be temporarily unavailable.
 
+                        We sincerely apologize for any inconvenience caused and appreciate
 
+                        your understanding and continued support.
 
+                    </div>
 
+
 
+                    <div class="tips-box">
 
+
 
+                        <h3 class="tips-title">
 
+                            During maintenance:
 
+                        </h3>
 
+
 
+                        <ul class="tips-list">
 
+                            <li>Login and trading functions may be temporarily unavailable.</li>
 
+                            <li>Some account operations may experience delays.</li>
 
+                            <li>Please avoid submitting repeated requests during the maintenance period.</li>
 
+                            <li>All services will automatically resume once maintenance is completed.</li>
 
+                        </ul>
 
+
 
+                    </div>
 
+
 
+                    <div class="footer-note">
 
+                        Thank you for your patience and support.
 
+                    </div>
 
+
 
+                </div>
 
+
 
+            </div>
 
+
 
+        </div>
 
+    </div>
 
+
 
+</body>
 
+
 
+</html>

Filskillnaden har hållts tillbaka eftersom den är för stor
+ 394 - 0
vu/pay/acepayment.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 394 - 0
vu/pay/alpha.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 394 - 0
vu/pay/b2bpay.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 394 - 0
vu/pay/hypehashing.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 394 - 0
vu/pay/nace.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 101 - 0
vu/pay/onchainpay.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 208 - 0
vu/pay/paycard.html


Filskillnaden har hållts tillbaka eftersom den är för stor
+ 221 - 0
vu/pay/paypaga.html


+ 485 - 0
vu/payment.html
Visa fil 

@@ -0,0 +1,485 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+  <meta charset="UTF-8" />
 
+  <title>Payment Status</title>
 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
+  <meta name="full-screen" content="yes">
 
+  <meta name="x5-fullscreen" content="true">
 
+
 
+  <link rel="stylesheet" href="css/element-ui.css" />
 
+  <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+
 
+  <style>
 
+    :root {
 
+      --primary: #eb3f57;
 
+      --primary-dark: #d92f48;
 
+      --primary-soft: #fff1f3;
 
+      --blue: #368fec;
 
+      --text-main: #111827;
 
+      --text-secondary: #4b5563;
 
+      --text-muted: #9ca3af;
 
+      --border: #e5e7eb;
 
+      --bg-page: #f5f7fb;
 
+      --bg-card: rgba(255, 255, 255, .96);
 
+      --radius-xl: 30px;
 
+      --radius-lg: 22px;
 
+      --radius-md: 16px;
 
+      --shadow-card:
 
+        0 24px 70px rgba(17, 24, 39, .08),
 
+        0 6px 20px rgba(17, 24, 39, .05);
 
+    }
 
+
 
+    * {
 
+      box-sizing: border-box;
 
+    }
 
+
 
+    html,
 
+    body {
 
+      margin: 0;
 
+      min-height: 100%;
 
+      background:
 
+        radial-gradient(circle at top left, rgba(235, 63, 87, .12), transparent 32%),
 
+        radial-gradient(circle at top right, rgba(59, 130, 246, .1), transparent 30%),
 
+        var(--bg-page);
 
+      font-family:
 
+        Inter,
 
+        -apple-system,
 
+        BlinkMacSystemFont,
 
+        "Segoe UI",
 
+        sans-serif;
 
+      color: var(--text-main);
 
+      -webkit-font-smoothing: antialiased;
 
+    }
 
+
 
+    img {
 
+      display: block;
 
+      max-width: 100%;
 
+    }
 
+
 
+    a {
 
+      text-decoration: none;
 
+    }
 
+
 
+    [v-cloak] {
 
+      display: none;
 
+    }
 
+
 
+    #payment {
 
+      width: 100%;
 
+      min-height: 100vh;
 
+      padding: 32px 20px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+    }
 
+
 
+    .payment-wrapper {
 
+      width: min(760px, 100%);
 
+    }
 
+
 
+    .payment-card {
 
+      overflow: hidden;
 
+      border-radius: var(--radius-xl);
 
+      border: 1px solid rgba(255, 255, 255, .75);
 
+      background: var(--bg-card);
 
+      backdrop-filter: blur(18px);
 
+      box-shadow: var(--shadow-card);
 
+    }
 
+
 
+    /* 
+    .payment-card::before {
 
+      content: "";
 
+      display: block;
 
+      width: 100%;
 
+      height: 5px;
 
+      background:
 
+        linear-gradient(90deg,
 
+          var(--primary),
 
+          var(--primary-dark));
 
+    } */
 
+
 
+    .card-header {
 
+      padding: 28px 34px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: space-between;
 
+      gap: 20px;
 
+      border-bottom: 1px solid var(--border);
 
+      background:
 
+        linear-gradient(180deg,
 
+          #ffffff 0%,
 
+          #fafcff 100%);
 
+    }
 
+
 
+    .logo-box img {
 
+      width: 150px;
 
+      object-fit: contain;
 
+    }
 
+
 
+    .language-switch {
 
+      display: inline-flex;
 
+      align-items: center;
 
+      padding: 10px 14px;
 
+      border-radius: 999px;
 
+      border: 1px solid var(--border);
 
+      background: #fff;
 
+      box-shadow:
 
+        0 10px 22px rgba(17, 24, 39, .04);
 
+    }
 
+
 
+    .language-switch .menu {
 
+      font-size: 14px;
 
+      font-weight: 700;
 
+      color: var(--text-main);
 
+      cursor: pointer;
 
+    }
 
+
 
+    .card-body {
 
+      padding: 42px 34px;
 
+      text-align: center;
 
+    }
 
+
 
+    .status-image {
 
+      width: 120px;
 
+      height: 120px;
 
+      margin: 0 auto 28px;
 
+      border-radius: 50%;
 
+      background: var(--primary-soft);
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      padding: 24px;
 
+      box-shadow:
 
+        inset 0 0 0 10px rgba(235, 63, 87, .06),
 
+        0 20px 40px rgba(235, 63, 87, .12);
 
+    }
 
+
 
+    .status-image img {
 
+      width: 100%;
 
+    }
 
+
 
+    .status-title {
 
+      margin: 0;
 
+      font-size: 30px;
 
+      font-weight: 850;
 
+      letter-spacing: -.03em;
 
+    }
 
+
 
+    .status-description {
 
+      margin: 24px auto 0;
 
+      max-width: 520px;
 
+      font-size: 15px;
 
+      line-height: 2;
 
+      color: var(--text-secondary);
 
+    }
 
+
 
+    .status-description a {
 
+      color: var(--blue);
 
+      font-weight: 800;
 
+      text-decoration: underline;
 
+    }
 
+
 
+    .support-card {
 
+      margin-top: 42px;
 
+      padding: 24px;
 
+      border-radius: var(--radius-lg);
 
+      border: 1px solid var(--border);
 
+      background:
 
+        linear-gradient(180deg,
 
+          #ffffff 0%,
 
+          #fafafa 100%);
 
+      display: flex;
 
+      align-items: center;
 
+      gap: 24px;
 
+      text-align: left;
 
+    }
 
+
 
+    .support-image {
 
+      width: 92px;
 
+      flex: 0 0 auto;
 
+    }
 
+
 
+    .support-text {
 
+      color: #64748b;
 
+      font-size: 13px;
 
+      line-height: 2;
 
+    }
 
+
 
+    .support-text span {
 
+      color: var(--blue);
 
+      font-weight: 700;
 
+      text-decoration: underline;
 
+    }
 
+
 
+    .footer-note {
 
+      margin-top: 34px;
 
+      padding-top: 28px;
 
+      border-top: 1px solid var(--border);
 
+      color: #9ca3af;
 
+      font-size: 12px;
 
+      line-height: 1.9;
 
+      text-align: left;
 
+    }
 
+
 
+    .footer-note strong {
 
+      color: #6b7280;
 
+    }
 
+
 
+    .card-footer {
 
+      margin-top: 28px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: space-between;
 
+      gap: 18px;
 
+      flex-wrap: wrap;
 
+    }
 
+
 
+    .footer-title {
 
+      font-size: 13px;
 
+      font-weight: 800;
 
+    }
 
+
 
+    .social-list {
 
+      display: flex;
 
+      align-items: center;
 
+      gap: 12px;
 
+      flex-wrap: wrap;
 
+    }
 
+
 
+    .social-item {
 
+      width: 42px;
 
+      height: 42px;
 
+      border-radius: 14px;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      background: #fff;
 
+      border: 1px solid var(--border);
 
+      transition:
 
+        transform .22s ease,
 
+        box-shadow .22s ease,
 
+        border-color .22s ease;
 
+    }
 
+
 
+    .social-item:hover {
 
+      transform: translateY(-2px);
 
+      border-color: rgba(235, 63, 87, .4);
 
+      box-shadow:
 
+        0 14px 30px rgba(235, 63, 87, .12);
 
+    }
 
+
 
+    .social-item img {
 
+      width: 20px;
 
+      height: 20px;
 
+      object-fit: contain;
 
+    }
 
+
 
+    .el-dropdown-menu {
 
+      border-radius: 14px;
 
+      overflow: hidden;
 
+    }
 
+
 
+    @media (max-width: 768px) {
 
+      #payment {
 
+        padding: 14px;
 
+        align-items: flex-start;
 
+      }
 
+
 
+      .payment-card {
 
+        border-radius: 24px;
 
+      }
 
+
 
+      .card-header {
 
+        padding: 22px 18px;
 
+      }
 
+
 
+      .language-switch {
 
+        justify-content: center;
 
+      }
 
+
 
+      .card-body {
 
+        padding: 30px 18px;
 
+      }
 
+
 
+      .status-image {
 
+        width: 96px;
 
+        height: 96px;
 
+      }
 
+
 
+      .status-title {
 
+        font-size: 24px;
 
+      }
 
+
 
+      .status-description {
 
+        font-size: 14px;
 
+        line-height: 1.8;
 
+      }
 
+
 
+      .support-card {
 
+        flex-direction: column;
 
+        text-align: center;
 
+      }
 
+
 
+      .footer-note {
 
+        text-align: center;
 
+      }
 
+
 
+      .card-footer {
 
+        justify-content: center;
 
+      }
 
+
 
+      .footer-title {
 
+        width: 100%;
 
+        text-align: center;
 
+      }
 
+    }
 
+  </style>
 
+</head>
 
+
 
+<body>
 
+
 
+  <div id="payment" v-if="isShow" v-cloak>
 
+    <div class="payment-wrapper">
 
+
 
+      <div class="payment-card">
 
+
 
+        <header class="card-header">
 
+
 
+          <div class="logo-box">
 
+            <img src="img/logo.jpg" alt="logo" />
 
+          </div>
 
+
 
+          <div class="language-switch">
 
+            <el-dropdown trigger="click" @command="chooseLang">
 
+
 
+              <span class="menu language-box">
 
+                {{langList[language]}}
 
+                <i class="el-icon-arrow-down el-icon--right"></i>
 
+              </span>
 
+
 
+              <el-dropdown-menu slot="dropdown">
 
+                <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                <el-dropdown-item command="zhHant">中文繁体</el-dropdown-item>
 
+                <el-dropdown-item command="en">English</el-dropdown-item>
 
+                <el-dropdown-item command="vn">Tiếng Việt</el-dropdown-item>
 
+                <el-dropdown-item command="de">Deutsch</el-dropdown-item>
 
+                <el-dropdown-item command="es">Español</el-dropdown-item>
 
+                <el-dropdown-item command="id">Indonesian</el-dropdown-item>
 
+                <el-dropdown-item command="ms">Melayu</el-dropdown-item>
 
+                <el-dropdown-item command="th">ภาษาไทย</el-dropdown-item>
 
+                <el-dropdown-item command="ar">العربية</el-dropdown-item>
 
+                <el-dropdown-item command="ko">한국어</el-dropdown-item>
 
+                <el-dropdown-item command="pt">Português</el-dropdown-item>
 
+                <el-dropdown-item command="fa">زبان پارسی</el-dropdown-item>
 
+                <el-dropdown-item command="tr">Türkçe</el-dropdown-item>
 
+              </el-dropdown-menu>
 
+
 
+            </el-dropdown>
 
+          </div>
 
+
 
+        </header>
 
+
 
+        <main class="card-body">
 
+
 
+          <!-- <div class="status-image">
 
+            <img src="img/wait.png" alt="status" />
 
+          </div> -->
 
+
 
+          <h1 class="status-title">
 
+            {{lang.item1}}
 
+          </h1>
 
+
 
+          <div class="status-description">
 
+            {{lang.item2}}
 
+            <a :href="'https://secure.' + ho + '.com/'">
 
+              {{lang.item3}}
 
+            </a>
 
+            {{lang.item4}}
 
+          </div>
 
+
 
+          <div class="support-card">
 
+
 
+            <!-- <div class="support-image">
 
+              <img src="img/kf.png" alt="support" />
 
+            </div> -->
 
+
 
+            <div class="support-text">
 
+              {{lang.item5}}
 
+              <span>{{lang.item6}}</span>
 
+              {{lang.item7}}
 
+              <span>{{lang.item8}}</span>
 
+              {{lang.item9}}
 
+            </div>
 
+
 
+          </div>
 
+
 
+          <div class="footer-note">
 
+            <strong>{{lang.item10}}</strong>
 
+            {{lang.item11}}
 
+          </div>
 
+
 
+          <div class="card-footer">
 
+
 
+            <div class="footer-title">
 
+              {{lang.item12}}
 
+            </div>
 
+
 
+            <div class="social-list">
 
+
 
+              <!-- <a
 
+              class="social-item"
 
+              href="https://www.youtube.com/channel/UCsezhM2kqgoJ5s4wyU2XFqw?view_as=subscriber"
 
+            >
 
+              <img src="img/1.png" alt="youtube" />
 
+            </a>
 
+
 
+            <a
 
+              class="social-item"
 
+              href="https://www.facebook.com/cwgmarkets-113157100404084/"
 
+            >
 
+              <img src="img/2.png" alt="facebook" />
 
+            </a>
 
+
 
+            <a
 
+              class="social-item"
 
+              href="https://www.linkedin.com/company/20863443"
 
+            >
 
+              <img src="img/3.png" alt="linkedin" />
 
+            </a>
 
+
 
+            <a
 
+              class="social-item"
 
+              href="https://instagram.com/cwgmarkets?igshid=5o01ctz1iser"
 
+            >
 
+              <img src="img/4.png" alt="instagram" />
 
+            </a>
 
+
 
+            <a
 
+              class="social-item"
 
+              href="https://twitter.com/MarketsCwg"
 
+            >
 
+              <img src="img/5.png" alt="twitter" />
 
+            </a> -->
 
+
 
+            </div>
 
+
 
+          </div>
 
+
 
+        </main>
 
+
 
+      </div>
 
+
 
+    </div>
 
+  </div>
 
+
 
+  <script src="js/vue.min.js"></script>
 
+  <script src="js/axios.min.js"></script>
 
+  <script src="js/element-ui.js"></script>
 
+  <script src="js/element@2.12.2.js"></script>
 
+  <script src="./assets/js/payment.js"></script>
 
+
 
+</body>
 
+
 
+</html>

+ 288 - 0
vu/resetMam.html
Visa fil 

@@ -0,0 +1,288 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8" />
 
+    <title>Reset MAM</title>
 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
+    <meta name="full-screen" content="yes">
 
+    <meta name="x5-fullscreen" content="true">
 
+    <meta name="viewport"
 
+        content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+    <link rel="stylesheet" href="css/element-ui.css" />
 
+    <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+    <link rel="stylesheet" href="css/index.css" />
 
+
 
+    <style>
 
+        :root {
 
+            --brand-red: #eb3f57;
 
+            --brand-red-dark: #d92f48;
 
+            --brand-red-soft: #fff1f3;
 
+            --text-main: #111827;
 
+            --text-secondary: #4b5563;
 
+            --text-muted: #9ca3af;
 
+            --border: #e5e7eb;
 
+            --card-bg: rgba(255, 255, 255, .96);
 
+            --page-bg: #f5f7fb;
 
+            --radius-xl: 28px;
 
+            --radius-lg: 20px;
 
+            --radius-md: 16px;
 
+            --shadow-card:
 
+                0 24px 70px rgba(17, 24, 39, .08),
 
+                0 6px 18px rgba(17, 24, 39, .05);
 
+            --shadow-red:
 
+                0 14px 30px rgba(235, 63, 87, .28);
 
+        }
 
+
 
+        * {
 
+            box-sizing: border-box;
 
+        }
 
+
 
+        body {
 
+            margin: 0;
 
+            min-height: 100vh;
 
+            background:
 
+                radial-gradient(circle at top left, rgba(235, 63, 87, .14), transparent 34%),
 
+                radial-gradient(circle at top right, rgba(59, 130, 246, .1), transparent 32%),
 
+                var(--page-bg);
 
+            font-family:
 
+                Inter,
 
+                -apple-system,
 
+                BlinkMacSystemFont,
 
+                "Segoe UI",
 
+                sans-serif;
 
+            color: var(--text-main);
 
+            -webkit-font-smoothing: antialiased;
 
+        }
 
+
 
+        img {
 
+            display: block;
 
+            max-width: 100%;
 
+        }
 
+
 
+        .container {
 
+            width: 100%;
 
+        }
 
+
 
+        .page-shell {
 
+            min-height: 100vh;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            padding: 32px 20px;
 
+        }
 
+
 
+        .reset-card {
 
+            width: min(480px, 100%);
 
+            border-radius: var(--radius-xl);
 
+            background: var(--card-bg);
 
+            box-shadow: var(--shadow-card);
 
+            padding: 34px;
 
+            border: 1px solid rgba(255, 255, 255, .75);
 
+            backdrop-filter: blur(18px);
 
+        }
 
+
 
+        .top-action {
 
+            display: flex;
 
+            justify-content: space-between;
 
+            align-items: center;
 
+            margin-bottom: 20px;
 
+        }
 
+
 
+        .language-switch {
 
+            display: inline-flex;
 
+            align-items: center;
 
+            gap: 8px;
 
+            padding: 10px 12px;
 
+            border-radius: 999px;
 
+            border: 1px solid var(--border);
 
+            background: #fff;
 
+        }
 
+
 
+        .language-switch img {
 
+            width: 18px;
 
+            height: 12px;
 
+            object-fit: cover;
 
+        }
 
+
 
+        .language-switch .menu {
 
+            font-size: 14px;
 
+            font-weight: 650;
 
+            cursor: pointer;
 
+        }
 
+
 
+        .logo img {
 
+            width: 160px;
 
+            border-radius: 18px;
 
+        }
 
+
 
+        .title-box {
 
+            text-align: center;
 
+            margin-bottom: 28px;
 
+        }
 
+
 
+        .title-box .icon {
 
+            width: 64px;
 
+            height: 64px;
 
+            margin: 0 auto 18px;
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: center;
 
+            border-radius: 20px;
 
+            background: var(--brand-red-soft);
 
+            color: var(--brand-red);
 
+            font-size: 30px;
 
+        }
 
+
 
+        .title-box h1 {
 
+            margin: 0;
 
+            font-size: 28px;
 
+            font-weight: 850;
 
+            letter-spacing: -.03em;
 
+        }
 
+
 
+        .title-box p {
 
+            margin: 12px 0 0;
 
+            font-size: 14px;
 
+            line-height: 1.7;
 
+            color: var(--text-secondary);
 
+        }
 
+
 
+        .form .el-form-item {
 
+            margin-bottom: 20px;
 
+        }
 
+
 
+        .m-input .el-input__inner {
 
+            height: 52px;
 
+            border-radius: var(--radius-md);
 
+            border: 1px solid var(--border);
 
+            padding-left: 16px;
 
+            font-size: 15px;
 
+            transition:
 
+                border-color .22s ease,
 
+                box-shadow .22s ease;
 
+        }
 
+
 
+        .m-input .el-input__inner:focus {
 
+            border-color: var(--brand-red);
 
+            box-shadow: 0 0 0 4px rgba(235, 63, 87, .1);
 
+        }
 
+
 
+        .m-input .el-input__inner::placeholder {
 
+            color: var(--text-muted);
 
+        }
 
+
 
+        .s-btn.el-button--primary {
 
+            width: 100%;
 
+            height: 52px;
 
+            border: none;
 
+            border-radius: 999px;
 
+            font-size: 16px;
 
+            font-weight: 800;
 
+            background:
 
+                linear-gradient(135deg,
 
+                    var(--brand-red),
 
+                    var(--brand-red-dark));
 
+            box-shadow: var(--shadow-red);
 
+            transition:
 
+                transform .22s ease,
 
+                box-shadow .22s ease;
 
+        }
 
+
 
+        .s-btn.el-button--primary:hover,
 
+        .s-btn.el-button--primary:focus {
 
+            transform: translateY(-2px);
 
+            box-shadow:
 
+                0 18px 38px rgba(235, 63, 87, .34);
 
+        }
 
+
 
+        .el-dropdown-menu {
 
+            border-radius: 14px;
 
+            overflow: hidden;
 
+        }
 
+
 
+        @media (max-width: 540px) {
 
+            .page-shell {
 
+                padding: 14px;
 
+                align-items: flex-start;
 
+
 
+            }
 
+
 
+            .reset-card {
 
+                padding: 24px 18px;
 
+                border-radius: 22px;
 
+                /* height: calc(100vh - 28px); */
 
+            }
 
+
 
+            .top-action {
 
+                justify-content: space-between;
 
+            }
 
+
 
+            .language-switch {
 
+                justify-content: center;
 
+            }
 
+
 
+            .title-box h1 {
 
+                font-size: 24px;
 
+            }
 
+
 
+            .m-input .el-input__inner,
 
+            .s-btn.el-button--primary {
 
+                height: 50px;
 
+            }
 
+        }
 
+    </style>
 
+</head>
 
+
 
+<body>
 
+    <div class="container" id="forget">
 
+        <div class="page-shell">
 
+            <div class="reset-card">
 
+
 
+                <div class="top-action">
 
+                    <div class="logo">
 
+                        <img src="img/logo.jpg" alt="Logo" />
 
+                    </div>
 
+                    <div class="language-switch chooseLang">
 
+                        <el-dropdown trigger="click" @command="chooseLang">
 
+                            <span class="menu">
 
+                                {{langList[language]}}
 
+                                <i class="el-icon-arrow-down el-icon--right"></i>
 
+                            </span>
 
+                            <el-dropdown-menu slot="dropdown">
 
+                                <el-dropdown-item command="en">English</el-dropdown-item>
 
+                                <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                            </el-dropdown-menu>
 
+                        </el-dropdown>
 
+                    </div>
 
+                </div>
 
+                <div class="title-box">
 
+                    <div class="icon">
 
+                        <i class="el-icon-lock"></i>
 
+                    </div>
 
+                    <h1>{{lang.item1}}</h1>
 
+                </div>
 
+                <el-form :model="params" :rules="rules" ref="params" label-width="0" class="form">
 
+                    <el-form-item prop="newPassword">
 
+                        <el-input class="m-input" v-model="params.newPassword" :placeholder="lang.item3"></el-input>
 
+                    </el-form-item>
 
+                    <el-form-item>
 
+                        <el-button type="primary" class="s-btn" @click="send">
 
+                            {{lang.btn}}
 
+                        </el-button>
 
+                    </el-form-item>
 
+                </el-form>
 
+            </div>
 
+        </div>
 
+    </div>
 
+
 
+    <script src="js/vue.min.js"></script>
 
+    <script src="js/axios.min.js"></script>
 
+    <script src="js/element-ui.js"></script>
 
+    <script src="js/element@2.12.2.js"></script>
 
+    <script src="js/resetMam.js"></script>
 
+
 
+</body>
 
+
 
+</html>

+ 499 - 0
vu/resetTrading.html
Visa fil 

@@ -0,0 +1,499 @@
 
+<!doctype html>
 
+<html lang="en">
 
+
 
+<head>
 
+  <meta charset="UTF-8" />
 
+  <title>Reset</title>
 
+  <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 
+  <meta name="full-screen" content="yes" />
 
+  <meta name="x5-fullscreen" content="true" />
 
+  <meta name="viewport"
 
+    content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+  <link rel="stylesheet" href="css/element-ui.css" />
 
+  <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+  <link rel="stylesheet" href="css/index.css" />
 
+
 
+  <style>
 
+    :root {
 
+      --brand-red: #eb3f57;
 
+      --brand-red-dark: #d92f48;
 
+      --brand-red-soft: #fff1f3;
 
+      --text-main: #111827;
 
+      --text-secondary: #4b5563;
 
+      --text-muted: #9ca3af;
 
+      --border: #e5e7eb;
 
+      --card-bg: rgba(255, 255, 255, 0.96);
 
+      --page-bg: #f5f7fb;
 
+      --success: #22c55e;
 
+      --radius-xl: 28px;
 
+      --radius-lg: 20px;
 
+      --radius-md: 16px;
 
+      --shadow-card: 0 24px 70px rgba(17, 24, 39, 0.08),
 
+        0 6px 18px rgba(17, 24, 39, 0.05);
 
+      --shadow-red: 0 14px 30px rgba(235, 63, 87, 0.28);
 
+    }
 
+
 
+    * {
 
+      box-sizing: border-box;
 
+    }
 
+
 
+    html,
 
+    body {
 
+      min-height: 100%;
 
+    }
 
+
 
+    body {
 
+      margin: 0;
 
+      background:
 
+        radial-gradient(circle at top left, rgba(235, 63, 87, 0.14), transparent 34%),
 
+        radial-gradient(circle at top right, rgba(59, 130, 246, 0.1), transparent 32%),
 
+        var(--page-bg);
 
+      color: var(--text-main);
 
+      font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
 
+        "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
 
+      -webkit-font-smoothing: antialiased;
 
+    }
 
+
 
+    img {
 
+      display: block;
 
+      max-width: 100%;
 
+    }
 
+
 
+    .container {
 
+      width: 100%;
 
+    }
 
+
 
+    .reset-page {
 
+      width: 100%;
 
+      min-height: 100vh;
 
+      display: flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      padding: 32px 20px;
 
+    }
 
+
 
+    .reset-card {
 
+      width: min(960px, 100%);
 
+      min-height: 620px;
 
+      display: grid;
 
+      grid-template-columns: 0.95fr 1.05fr;
 
+      overflow: hidden;
 
+      border-radius: var(--radius-xl);
 
+      border: 1px solid rgba(255, 255, 255, 0.75);
 
+      background: var(--card-bg);
 
+      box-shadow: var(--shadow-card);
 
+      backdrop-filter: blur(18px);
 
+    }
 
+
 
+    .reset-visual {
 
+      position: relative;
 
+      padding: 36px;
 
+      overflow: hidden;
 
+      color: #fff;
 
+      background:
 
+        linear-gradient(135deg, rgba(235, 63, 87, 0.97), rgba(185, 28, 28, 0.92)),
 
+        var(--brand-red);
 
+    }
 
+
 
+    .reset-visual::before,
 
+    .reset-visual::after {
 
+      content: "";
 
+      position: absolute;
 
+      border-radius: 999px;
 
+      background: rgba(255, 255, 255, 0.16);
 
+    }
 
+
 
+    .reset-visual::before {
 
+      width: 260px;
 
+      height: 260px;
 
+      left: -90px;
 
+      bottom: -90px;
 
+    }
 
+
 
+    .reset-visual::after {
 
+      width: 180px;
 
+      height: 180px;
 
+      right: -60px;
 
+      top: 80px;
 
+    }
 
+
 
+    .visual-inner {
 
+      position: relative;
 
+      z-index: 1;
 
+      height: 100%;
 
+      display: flex;
 
+      flex-direction: column;
 
+      justify-content: space-between;
 
+    }
 
+
 
+    .brand-logo {
 
+      width: 154px;
 
+      max-height: 76px;
 
+      object-fit: contain;
 
+      padding: 12px;
 
+      border-radius: 18px;
 
+      background: rgba(255, 255, 255, 1);
 
+      box-shadow: 0 16px 36px rgba(17, 24, 39, 0.16);
 
+    }
 
+
 
+    .visual-content {
 
+      margin-top: 76px;
 
+    }
 
+
 
+    .visual-icon {
 
+      width: 60px;
 
+      height: 60px;
 
+      display: inline-flex;
 
+      align-items: center;
 
+      justify-content: center;
 
+      border-radius: 20px;
 
+      font-size: 30px;
 
+      background: rgba(255, 255, 255, 0.18);
 
+      border: 1px solid rgba(255, 255, 255, 0.26);
 
+      backdrop-filter: blur(12px);
 
+    }
 
+
 
+    .visual-title {
 
+      margin: 24px 0 0;
 
+      font-size: 34px;
 
+      line-height: 1.15;
 
+      font-weight: 850;
 
+      letter-spacing: -0.04em;
 
+    }
 
+
 
+    .visual-desc {
 
+      margin: 16px 0 0;
 
+      max-width: 330px;
 
+      color: rgba(255, 255, 255, 0.84);
 
+      font-size: 15px;
 
+      line-height: 1.75;
 
+    }
 
+
 
+    .security-note {
 
+      margin-top: 34px;
 
+      padding: 16px;
 
+      border-radius: 18px;
 
+      background: rgba(255, 255, 255, 0.14);
 
+      border: 1px solid rgba(255, 255, 255, 0.2);
 
+      color: rgba(255, 255, 255, 0.86);
 
+      font-size: 13px;
 
+      line-height: 1.65;
 
+      backdrop-filter: blur(12px);
 
+    }
 
+
 
+    .reset-panel {
 
+      padding: 30px 42px 38px;
 
+      background: linear-gradient(180deg, #ffffff 0%, #fafafa 100%);
 
+    }
 
+
 
+    .top-action {
 
+      display: flex;
 
+      justify-content: flex-end;
 
+      margin-bottom: 42px;
 
+    }
 
+
 
+    .language-switch {
 
+      display: inline-flex;
 
+      align-items: center;
 
+      gap: 8px;
 
+      padding: 10px 12px;
 
+      border: 1px solid var(--border);
 
+      border-radius: 999px;
 
+      background: #fff;
 
+      box-shadow: 0 8px 20px rgba(17, 24, 39, 0.04);
 
+    }
 
+
 
+    .language-switch img {
 
+      width: 18px;
 
+      height: 12px;
 
+      object-fit: cover;
 
+      border-radius: 2px;
 
+    }
 
+
 
+    .language-switch .menu {
 
+      color: var(--text-main);
 
+      font-size: 14px;
 
+      font-weight: 650;
 
+      cursor: pointer;
 
+    }
 
+
 
+    .mobile-logo {
 
+      display: none;
 
+      width: 160px;
 
+      border-radius: 16px;
 
+    }
 
+
 
+    .form-heading {
 
+      margin-bottom: 26px;
 
+    }
 
+
 
+    .form-heading h1 {
 
+      margin: 0;
 
+      color: var(--text-main);
 
+      font-size: 28px;
 
+      line-height: 1.2;
 
+      font-weight: 850;
 
+      letter-spacing: -0.035em;
 
+    }
 
+
 
+    .form-heading p {
 
+      margin: 10px 0 0;
 
+      color: var(--text-secondary);
 
+      font-size: 14px;
 
+      line-height: 1.7;
 
+    }
 
+
 
+    .form {
 
+      width: 100%;
 
+      max-width: 450px;
 
+      margin: 0 auto;
 
+    }
 
+
 
+    .form .el-form-item {
 
+      margin-bottom: 18px;
 
+    }
 
+
 
+    .m-input .el-input__inner {
 
+      height: 52px;
 
+      padding-left: 16px;
 
+      padding-right: 44px;
 
+      border-radius: var(--radius-md);
 
+      border: 1px solid var(--border);
 
+      color: var(--text-main);
 
+      font-size: 15px;
 
+      background: #fff;
 
+      transition: border-color 0.22s ease, box-shadow 0.22s ease;
 
+    }
 
+
 
+    .m-input .el-input__inner:focus {
 
+      border-color: var(--brand-red);
 
+      box-shadow: 0 0 0 4px rgba(235, 63, 87, 0.1);
 
+    }
 
+
 
+    .m-input .el-input__inner::placeholder {
 
+      color: var(--text-muted);
 
+    }
 
+
 
+    .m-input .el-input__suffix {
 
+      right: 12px;
 
+    }
 
+
 
+    .pwd {
 
+      margin: 4px 0 6px;
 
+      padding: 16px 18px 16px 38px;
 
+      border-radius: 18px;
 
+      border: 1px solid var(--border);
 
+      background: #fff;
 
+      text-align: left;
 
+    }
 
+
 
+    .pwd li {
 
+      list-style-type: disc;
 
+      line-height: 1.7;
 
+      color: var(--text-muted);
 
+      font-size: 13px;
 
+      transition: color 0.22s ease;
 
+    }
 
+
 
+    .pwd .fit {
 
+      color: var(--success);
 
+      font-weight: 650;
 
+    }
 
+
 
+    .pwd .fit::marker {
 
+      color: var(--success);
 
+    }
 
+
 
+    .s-btn.el-button--primary {
 
+      width: 100%;
 
+      height: 52px;
 
+      border: none;
 
+      border-radius: 999px;
 
+      font-size: 16px;
 
+      font-weight: 800;
 
+      background: linear-gradient(135deg, var(--brand-red), var(--brand-red-dark));
 
+      box-shadow: var(--shadow-red);
 
+      transition: transform 0.22s ease, box-shadow 0.22s ease;
 
+    }
 
+
 
+    .s-btn.el-button--primary:hover,
 
+    .s-btn.el-button--primary:focus {
 
+      transform: translateY(-2px);
 
+      box-shadow: 0 18px 38px rgba(235, 63, 87, 0.34);
 
+    }
 
+
 
+    .el-form-item__error {
 
+      padding-top: 6px;
 
+      font-size: 12px;
 
+    }
 
+
 
+    .el-dropdown-menu {
 
+      border-radius: 14px;
 
+      overflow: hidden;
 
+    }
 
+
 
+    .el-button,
 
+    .el-input__inner {
 
+      font-family: inherit;
 
+    }
 
+
 
+    @media (max-width: 900px) {
 
+      .reset-page {
 
+        align-items: flex-start;
 
+        padding: 22px 14px;
 
+      }
 
+
 
+      .reset-card {
 
+        grid-template-columns: 1fr;
 
+        min-height: auto;
 
+      }
 
+
 
+      .reset-visual {
 
+        display: none;
 
+      }
 
+
 
+      .reset-panel {
 
+        padding: 24px 24px 32px;
 
+      }
 
+
 
+      .top-action {
 
+        margin-bottom: 22px;
 
+      }
 
+
 
+      .mobile-logo {
 
+        display: block;
 
+      }
 
+
 
+      .form-heading {
 
+        text-align: center;
 
+      }
 
+    }
 
+
 
+    @media (max-width: 540px) {
 
+      .reset-page {
 
+        padding: 12px;
 
+      }
 
+
 
+      .reset-card {
 
+        border-radius: 22px;
 
+      }
 
+
 
+      .reset-panel {
 
+        padding: 20px 16px 26px;
 
+      }
 
+
 
+      .top-action {
 
+        justify-content: space-between;
 
+      }
 
+
 
+      .language-switch {
 
+        /* width: 100%; */
 
+        justify-content: center;
 
+      }
 
+
 
+      .form-heading h1 {
 
+        font-size: 23px;
 
+      }
 
+
 
+      .form-heading p {
 
+        font-size: 13px;
 
+      }
 
+
 
+      .m-input .el-input__inner,
 
+      .s-btn.el-button--primary {
 
+        height: 50px;
 
+      }
 
+
 
+      .pwd {
 
+        padding: 14px 14px 14px 32px;
 
+        border-radius: 16px;
 
+      }
 
+    }
 
+  </style>
 
+</head>
 
+
 
+<body>
 
+  <div class="container" id="forget">
 
+    <div class="reset-page">
 
+      <div class="reset-card">
 
+        <aside class="reset-visual">
 
+          <div class="visual-inner">
 
+            <img class="brand-logo" src="img/logo.jpg" alt="Logo" />
 
+
 
+            <div class="visual-content">
 
+              <div class="visual-icon">
 
+                <i class="el-icon-lock"></i>
 
+              </div>
 
+              <h1 class="visual-title">{{lang.item1}}</h1>
 
+              <p class="visual-desc">
 
+                {{lang.item6}}
 
+              </p>
 
+            </div>
 
+
 
+            <div class="security-note">
 
+              {{lang.item7}}
 
+            </div>
 
+          </div>
 
+        </aside>
 
+
 
+        <main class="reset-panel">
 
+          <div class="top-action">
 
+            <img class="mobile-logo" src="img/logo.jpg" alt="Logo" />
 
+            <div class="language-switch chooseLang">
 
+              <el-dropdown trigger="click" @command="chooseLang">
 
+                <span class="menu">
 
+                  {{langList[language]}}
 
+                  <i class="el-icon-arrow-down el-icon--right"></i>
 
+                </span>
 
+                <el-dropdown-menu slot="dropdown">
 
+                  <el-dropdown-item command="en">English</el-dropdown-item>
 
+                  <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                </el-dropdown-menu>
 
+              </el-dropdown>
 
+            </div>
 
+          </div>
 
+
 
+
 
+
 
+          <div class="form-heading">
 
+            <h1>{{lang.item1}}</h1>
 
+            <p>{{lang.item8}}</p>
 
+          </div>
 
+
 
+          <el-form :model="params" :rules="rules" ref="params" label-width="0" class="form">
 
+            <el-form-item prop="newPassword">
 
+              <el-input show-password class="m-input" v-model="params.newPassword" :placeholder="lang.item3"></el-input>
 
+            </el-form-item>
 
+
 
+            <el-form-item prop="password1">
 
+              <el-input show-password class="m-input" v-model="params.password1" :placeholder="lang.item4"></el-input>
 
+            </el-form-item>
 
+
 
+            <el-form-item>
 
+              <ul class="pwd">
 
+                <li :class="{ fit: rule1 }">{{lang.st1}}</li>
 
+                <li :class="{ fit: rule2 }">{{lang.nd2}}</li>
 
+                <li :class="{ fit: rule3 }">{{lang.rd3}}</li>
 
+              </ul>
 
+            </el-form-item>
 
+
 
+            <el-form-item>
 
+              <el-button type="primary" class="s-btn" @click="send">
 
+                {{lang.btn}}
 
+              </el-button>
 
+            </el-form-item>
 
+          </el-form>
 
+        </main>
 
+      </div>
 
+    </div>
 
+  </div>
 
+
 
+  <script src="js/vue.min.js"></script>
 
+  <script src="js/axios.min.js"></script>
 
+  <script src="js/element-ui.js"></script>
 
+  <script src="js/element@2.12.2.js"></script>
 
+  <script src="js/reset.js"></script>
 
+</body>
 
+
 
+</html>

+ 70 - 0
vu/test.html
Visa fil 

@@ -0,0 +1,70 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+<head>
 
+    <meta charset="UTF-8">
 
+    <title>WebSocket</title>
 
+
 
+</head>
 
+<body>
 
+<h3>hello socket</h3>
 
+<p>【userId】：<div><input id="userId" name="userId" type="text" value="10"></div>
 
+<p>【toUserId】：<div><input id="toUserId" name="toUserId" type="text" value="20"></div>
 
+<p>【toUserId】：<div><input id="contentText" name="contentText" type="text" value="hello websocket"></div>
 
+<p>操作:<div><a onclick="openSocket()">开启socket</a></div>
 
+<p>【操作】：<div><a onclick="sendMessage()">发送消息</a></div>
 
+</body>
 
+<script>
 
+    
+
 
+    var socket;
 
+    function openSocket() {
 
+        if(typeof(WebSocket) == "undefined") {
 
+            console.log("您的浏览器不支持WebSocket");
 
+        }else{
 
+            console.log("您的浏览器支持WebSocket");
 
+            //实现化WebSocket对象，指定要连接的服务器地址与端口  建立连接
 
+            var userId = document.getElementById('userId').value;
 
+            // var socketUrl="ws://127.0.0.1:22599/webSocket/"+userId;
 
+            var socketUrl="ws://47.75.159.72:8000/webSocket?Access-Token=ZUxUE6VveVDjr/CMhyhxuNlIUISdD7hzXpIfTS8bVW/ZkdhXeH6L71ymZEXJro4c";
 
+            console.log(socketUrl);
 
+            if(socket!=null){
 
+                socket.close();
 
+                socket=null;
 
+            }
 
+            socket = new WebSocket(socketUrl);
 
+            //打开事件
 
+            socket.onopen = function() {
 
+                console.log("websocket已打开");
 
+                //socket.send("这是来自客户端的消息" + location.href + new Date());
 
+            };
 
+            //获得消息事件
 
+            socket.onmessage = function(msg) {
 
+                var serverMsg = "收到服务端信息：" + msg.data;
 
+                console.log(serverMsg);
 
+                //发现消息进入    开始处理前端触发逻辑
 
+            };
 
+            //关闭事件
 
+            socket.onclose = function() {
 
+                console.log("websocket已关闭");
 
+            };
 
+            //发生了错误事件
 
+            socket.onerror = function() {
 
+                console.log("websocket发生了错误");
 
+            }
 
+        }
 
+    }
 
+    function sendMessage() {
 
+        if(typeof(WebSocket) == "undefined") {
 
+            console.log("您的浏览器不支持WebSocket");
 
+        }else {
 
+            // console.log("您的浏览器支持WebSocket");
 
+            var toUserId = document.getElementById('toUserId').value;
 
+            var contentText = document.getElementById('contentText').value;
 
+            var msg = '{"toUserId":"'+toUserId+'","contentText":"'+contentText+'"}';
 
+            console.log(msg);
 
+            socket.send(msg);
 
+        }
 
+    }
 
+
 
+    </script>
 
+</html>

+ 183 - 0
vu/unsubscribe.html
Visa fil 

@@ -0,0 +1,183 @@
 
+<!DOCTYPE html>
 
+<html lang="en">
 
+
 
+<head>
 
+    <meta charset="UTF-8" />
 
+    <title>Unsubscribe</title>
 
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
 
+    <meta name="full-screen" content="yes">
 
+    <meta name="x5-fullscreen" content="true">
 
+    <meta name="viewport"
 
+        content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no" />
 
+
 
+    <link rel="stylesheet" href="css/element-ui.css" />
 
+    <link rel="stylesheet" href="css/element@2.12.2.css" />
 
+    <style>
 
+        :root {
 
+            --primary: #ef4444;
 
+            --primary-dark: #dc2626;
 
+            --primary-soft: #fef2f2;
 
+            --text-main: #0f172a;
 
+            --text-secondary: #475569;
 
+            --text-muted: #94a3b8;
 
+            --border: #e2e8f0;
 
+            --bg-page: #f5f7fb;
 
+            --bg-card: rgba(255, 255, 255, .96);
 
+            --radius-xl: 28px;
 
+            --radius-lg: 22px;
 
+            --shadow-card: 0 24px 70px rgba(15, 23, 42, .08), 0 6px 20px rgba(15, 23, 42, .05);
 
+        }
 
+
 
+        * {
 
+            box-sizing: border-box;
 
+        }
 
+
 
+        body {
 
+            margin: 0;
 
+            min-height: 100vh;
 
+            font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
 
+            background: var(--bg-page);
 
+            color: var(--text-main);
 
+            -webkit-font-smoothing: antialiased;
 
+        }
 
+
 
+        .container {
 
+            display: flex;
 
+            justify-content: center;
 
+            padding: 40px 20px;
 
+        }
 
+
 
+        .unsubscribe-card {
 
+            width: min(680px, 100%);
 
+            background: var(--bg-card);
 
+            border-radius: var(--radius-xl);
 
+            box-shadow: var(--shadow-card);
 
+            padding: 32px;
 
+        }
 
+
 
+        .title-head {
 
+            display: flex;
 
+            align-items: center;
 
+            gap: 12px;
 
+            font-size: 24px;
 
+            font-weight: 700;
 
+            margin-bottom: 24px;
 
+        }
 
+
 
+        .content-info {
 
+            display: flex;
 
+            flex-direction: column;
 
+            gap: 18px;
 
+        }
 
+
 
+        .language-switch {
 
+            display: inline-flex;
 
+            align-items: center;
 
+            gap: 8px;
 
+            padding: 8px 12px;
 
+            border: 1px solid var(--border);
 
+            border-radius: 999px;
 
+            background: #fff;
 
+        }
 
+
 
+        .logo img {
 
+            display: block;
 
+            margin: 0 auto;
 
+            width: 160px;
 
+        }
 
+
 
+        .form .el-form-item {
 
+            margin-bottom: 16px;
 
+        }
 
+
 
+        .myCheck .el-checkbox {
 
+            display: block;
 
+            font-size: 14px;
 
+            color: var(--text-secondary);
 
+        }
 
+
 
+        .m-input .el-input__inner {
 
+            border-radius: 16px;
 
+            border: 1px solid var(--border);
 
+            height: 44px;
 
+            font-size: 14px;
 
+        }
 
+
 
+        .s-btn.el-button--primary {
 
+            width: 100%;
 
+            height: 48px;
 
+            border: none;
 
+            border-radius: 999px;
 
+            font-weight: 700;
 
+            background: linear-gradient(135deg, var(--primary), var(--primary-dark));
 
+            box-shadow: 0 12px 28px rgba(239, 68, 68, .28);
 
+            transition: all .25s ease;
 
+        }
 
+
 
+        .s-btn.el-button--primary:hover {
 
+            transform: translateY(-2px);
 
+            box-shadow: 0 16px 36px rgba(239, 68, 68, .32);
 
+        }
 
+
 
+        .header {
 
+            display: flex;
 
+            align-items: center;
 
+            justify-content: space-between;
 
+            margin-bottom: 24px;
 
+        }
 
+    </style>
 
+</head>
 
+
 
+<body>
 
+    <div class="container" id="unsubscribe">
 
+        <div class="unsubscribe-card">
 
+            <header class="header">
 
+                <div class="logo"><img src="img/logo.jpg" alt="Logo" /></div>
 
+                <div class="language-switch chooseLang">
 
+                    <el-dropdown trigger="click" @command="chooseLang">
 
+                        <span class="menu">{{langList[language]}}<i
 
+                                class="el-icon-arrow-down el-icon--right"></i></span>
 
+                        <el-dropdown-menu slot="dropdown">
 
+                            <el-dropdown-item command="en">English</el-dropdown-item>
 
+                            <el-dropdown-item command="cn">中文简体</el-dropdown-item>
 
+                        </el-dropdown-menu>
 
+                    </el-dropdown>
 
+                </div>
 
+            </header>
 
+
 
+            <div class="title-head"><i class="el-icon-star-on"></i> <span>{{lang.item1}}</span></div>
 
+            <div class="content-info">
 
+
 
+                <el-form :model="params" :rules="rules" ref="params" label-width="0" class="form">
 
+                    <el-form-item prop=""><span
 
+                            style="font-size:16px;font-weight:bold;">{{lang.item2}}</span></el-form-item>
 
+                    <el-form-item prop="">{{lang.item3}}</el-form-item>
 
+                    <el-form-item prop=""><span>{{lang.item4}}</span></el-form-item>
 
+                    <el-form-item prop="">
 
+                        <el-checkbox-group class="myCheck" v-model="params.reasons">
 
+                            <el-checkbox :label="lang.item5"></el-checkbox>
 
+                            <el-checkbox :label="lang.item6"></el-checkbox>
 
+                            <el-checkbox :label="lang.item7"></el-checkbox>
 
+                            <el-checkbox :label="lang.item8"></el-checkbox>
 
+                            <el-checkbox :label="lang.item9"></el-checkbox>
 
+                        </el-checkbox-group>
 
+                    </el-form-item>
 
+                    <el-form-item>
 
+                        <el-input show-password class="m-input" type="textarea" :rows="2" v-model="params.reasonsOther"
 
+                            :placeholder="lang.item9"></el-input>
 
+                    </el-form-item>
 
+                    <el-form-item>
 
+                        <el-button type="primary" class="s-btn" @click="send">{{lang.btn}}</el-button>
 
+                    </el-form-item>
 
+                </el-form>
 
+            </div>
 
+        </div>
 
+    </div>
 
+    <script src="js/vue.min.js"></script>
 
+    <script src="js/axios.min.js"></script>
 
+    <script src="js/element-ui.js"></script>
 
+    <script src="js/element@2.12.2.js"></script>
 
+    <script src="js/unsubscribe.js"></script>
 
+</body>
 
+
 
+</html>

+ 143 - 0
vu/upload.js
Visa fil 

@@ -0,0 +1,143 @@
 
+/*
 
+ * @Description: 统一上传工具，先获取uploadToken，再上传到新接口
 
+ * @Author: Auto
 
+ * @Date: 2024-01-01
 
+ */
 
+// axios 通过 <script> 标签在 HTML 中全局加载，直接使用全局变量
 
+
 
+let ho = window.location.host.split('.')[1];
 
+let host80 = 'https://secure.' + ho + '.com';
 
+let host05 = 'https://file.' + ho + '.com';
 
+
 
+/**
 
+ * 统一上传方法
 
+ * @param {File} file - 要上传的文件
 
+ * @param {String} originalUrl - 原上传接口URL（用于获取uploadToken）
 
+ * @param {Object} headers - 请求头
 
+ * @param {Function} onProgress - 上传进度回调
 
+ * @returns {Promise} 上传结果
 
+ */
 
+async function unifiedUpload(file, originalUrl, headers, onProgress) {
 
+  headers = headers || {};
 
+  onProgress = onProgress || null;
 
+  try {
 
+    // 第一步：调用原接口获取 uploadToken
 
+    const formData = new FormData()
 
+    formData.append('file', file)
 
+    
+    // 设置请求头
 
+    const requestHeaders = {
 
+      'Access-Token': sessionStorage.getItem("access_token") || '',
 
+      'Language': sessionStorage.getItem("lang") || '',
 
+      'CLIENT': sessionStorage.getItem("CLIENT") || ''
 
+    };
 
+    // ES5 方式合并 headers
 
+    for (var key in headers) {
 
+      if (headers.hasOwnProperty(key)) {
 
+        requestHeaders[key] = headers[key];
 
+      }
 
+    }
 
+    
+    // 获取基础URL
 
+    let baseURL = host80
 
+    
+    // 提取原接口路径
 
+    let originalPath = originalUrl
 
+    if (originalUrl.startsWith('http://') || originalUrl.startsWith('https://')) {
 
+      // 完整URL，提取路径部分
 
+      const urlObj = new URL(originalUrl)
 
+      originalPath = urlObj.pathname
 
+    }
 
+    
+    // 调用原接口获取 uploadToken（先不传文件，只获取token）
 
+    // 如果原接口需要文件才能返回token，则传文件
 
+    const tokenFormData = new FormData()
 
+    tokenFormData.append('file', file)
 
+    
+    const tokenResponse = await window.axios.post(originalPath, tokenFormData, {
 
+      baseURL: baseURL,
 
+      headers: requestHeaders,
 
+      timeout: 30000
 
+    })
 
+    
+    // 从原接口响应中获取 uploadToken
 
+    // 假设原接口返回格式为 { code: 200, data: { uploadToken: 'xxx', ... } } 或 { code: 200, uploadToken: 'xxx' }
 
+    let uploadToken = null
 
+    if (tokenResponse.data.code == 200) {
 
+        if (tokenResponse.data.data.path) {
 
+            // 如果直接返回 uploadToken
 
+            uploadToken = tokenResponse.data.data.path
 
+        }
 
+    }
 
+    
+    if (!uploadToken) {
 
+      throw new Error('Failed to get uploadToken from original upload interface')
 
+    }
 
+    
+    // 第二步：使用新接口上传文件
 
+    const uploadFormData = new FormData()
 
+    uploadFormData.append('file', file)
 
+    uploadFormData.append('uploadToken', uploadToken)
 
+    
+    const uploadResponse = await window.axios.post('/common/base/upload', uploadFormData, {
 
+      baseURL: host05,
 
+      headers: requestHeaders,
 
+      timeout: 60000,
 
+      onUploadProgress: (progressEvent) => {
 
+        if (onProgress && progressEvent.total) {
 
+          const percent = Math.round((progressEvent.loaded * 100) / progressEvent.total)
 
+          onProgress({ percent })
 
+        }
 
+      }
 
+    })
 
+    
+    return uploadResponse.data
 
+    
+  } catch (error) {
 
+    console.error('Upload error:', error)
 
+    if (error.response) {
 
+      return {
 
+        code: error.response.status || 400,
 
+        msg: (error.response.data && error.response.data.msg) || error.message || 'Upload failed'
 
+      }
 
+    }
 
+    return {
 
+      code: 400,
 
+      msg: error.message || 'Upload failed'
 
+    }
 
+  }
 
+}
 
+
 
+/**
 
+ * 为 Element UI Upload 组件创建自定义上传方法
 
+ * @param {String} originalUrl - 原上传接口URL
 
+ * @param {Object} headers - 请求头
 
+ * @returns {Function} http-request 方法
 
+ */
 
+function createUploadRequest(originalUrl, headers) {
 
+  headers = headers || {};
 
+  return async function(options) {
 
+    const file = options.file;
 
+    const onProgress = options.onProgress;
 
+    const onSuccess = options.onSuccess;
 
+    const onError = options.onError;
 
+    
+    try {
 
+      const result = await unifiedUpload(file, originalUrl, headers, onProgress)
 
+      
+      if (result.code === 200) {
 
+        onSuccess(result)
 
+      } else {
 
+        onError(new Error(result.msg || 'Upload failed'))
 
+      }
 
+    } catch (error) {
 
+      onError(error)
 
+    }
 
+  }
 
+}
 
+
 
+// ES5 方式暴露到全局对象
 
+if (typeof window !== 'undefined') {
 
+  window.createUploadRequest = createUploadRequest;
 
+}
 
+

Vissa filer visades inte eftersom för många filer har ändrats