Epusdt跨平台usdt收付中间件USDT支付界面美化源码分享

老铁铺 PHP发卡 2023年12月26日 854 0
Epusdt跨平台usdt收付中间件USDT支付界面美化源码分享

Epusdt(全称:Easy Payment Usdt)是一个由Go语言编写的私有化部署Usdt支付中间件(Trc20网络)

站长或开发者可通过Epusdt提供的http api集成至您的任何系统,无需过多的配置,仅仅依赖mysql和redis

可实现USDT的在线支付和消息回调,这一切在优雅和顷刻间完成!

私有化搭建使得无需额外的手续费和签约费用,Usdt代币直接进入您的钱包

项目地址:https://github.com/assimon/epusdt

作者自带的支付扫码界面过于简陋,于是修改美化如下,如有需要请自行下载代码覆盖即可

先备份/static下的index.html文件,然后用以下代码全部替换index.html文件内容即可

完整的代码包下载地址:https://wwi.lanzoup.com/iKqHX1izh09g

密码:9ib6

Epusdt跨平台usdt收付中间件USDT支付界面美化源码分享

<html><head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
            <meta name="author" content="老铁铺laotie.love">
            <meta http-equiv="Content-Language" content="zh-cn">
            <meta name="apple-mobile-web-app-capable" content="no">
            <meta name="apple-touch-fullscreen" content="yes">
            <meta name="format-detection" content="telephone=no,email=no">
            <meta name="apple-mobile-web-app-status-bar-style" content="white">
            <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
            <meta http-equiv="Expires" content="0">
            <meta http-equiv="Pragma" content="no-cache">
            <meta http-equiv="Cache-control" content="no-cache">
            <meta http-equiv="Cache" content="no-cache">
            <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
            <title>老铁铺苹果ID账号零售批发</title>
            <link rel="stylesheet" type="text/css" href="/static/qrcode.css">

            <link rel="shortcut icon" href="/static/favicon.ico">
            <link rel="stylesheet" type="text/css" href="/static/core.css">
    </head>
    <body>
        <div id="main">
            <div style="text-align:center">
                <div class="make">
                    <p><img class="logo" src="/static/trc.png" style="height:50px;" alt="logo"></p>
                    <span style="font-weight:bold;font-size:15px">
                        <p>商户单号:{{.TradeId}}</p>

                        <p>点击钱包地址或金额可直接复制</p>
                    </span>
                    <p class="money" id="copy-amount" data-clipboard-text="{{.ActualAmount}}" style="font-weight:bold; color:green;font-size:25px">{{.ActualAmount}} USDT</p><br>
                    <p class="qr-code"></p>
                    <p style="font-weight:bold; color:red;margin-bottom: 5px;font-size:15px">当前USDT支付区块网络协议为TRC20</p>
                    <p class="money" style="font-weight:bold; color:red;margin-bottom: 5px;">付款金额是 {{.ActualAmount}},不能多付也不能少付</p>
                    <p style="font-weight:bold; color:red;margin-bottom: 5px;font-size:15px">请勿关闭此页面等待自动跳转!</p>
                    <p id="copy-token" data-clipboard-text="{{.Token}}" style="font-weight:bold; color:red;font-size:15px">钱包地址:  {{.Token}}</p>
                    <div class="info">
                        <p id="divTime">有效时间:<small style="color:red; font-size:30px">0</small>时<small style="color:red; font-size:30px">0</small>分<small style="color:red; font-size:30px">0</small>秒,失效勿付</p>
                    </div>
                </div>
            </div>
        </div>

<script src="/static/js/jquery.min.js"></script>
<script src="/static/js/jquery.qrcode.min.js"></script>
<script src="/static/js/clipboard.min.js"></script>
<script src="/static/js/layer.js"></script>
<script>

  // 支付时间倒计时
  function clock() {
    let timeout = new Date({{.ExpirationTime}});
    let now = new Date();
    let ms = timeout.getTime() - now.getTime();//时间差的毫秒数
    let second = Math.round(ms / 1000);
    let minute = Math.floor(second / 60);
    let hour = Math.floor(minute / 60);
    if (ms <= 0) {
      layer.alert("支付超时,请重新发起支付!", {icon: 5});
      return;
    }
    $('.hours').text(hour.toString().padStart(2, '0'));
    $('.minutes').text(minute.toString().padStart(2, '0'));
    $('.seconds').text((second % 60).toString().padStart(2, '0'));
    return setTimeout(clock, 1000);
  }
  setTimeout(clock, 1000);

  $('.qr-code').qrcode({
    text: "{{.Token}}",
    width: 200,
    height: 200,
    foreground: "#000000",
    background: "#ffffff",
    typeNumber: -1
  });

  // 金额复制
  var copyAmount = new ClipboardJS('#copy-amount');
  copyAmount.on('success', function (e) {
    layer.msg('复制金额成功', {icon: 1});
  });
  copyAmount.on('error', function (e) {
    layer.msg('复制金额失败', {icon: 5});
  });

  // 钱包复制
  var copyToken = new ClipboardJS('#copy-token');
  copyToken.on('success', function (e) {
    layer.msg('复制钱包地址成功', {icon: 1});
  });
  copyToken.on('error', function (e) {
    layer.msg('复制钱包地址失败', {icon: 5});
  });

  function checkOrderStatus() {
    $.ajax({
      type: "GET",
      dataType: "json",
      url: "/pay/check-status/{{.TradeId}}",
      timeout: 10000,
      success: function (response, status) {
        if (response.data.status == 2) {
          layer.msg('支付成功,正在跳转中...', {icon: 16, shade: 0.01, time: 20000});
          window.location.href = {{.RedirectUrl}};
        } else {
          setTimeout("checkOrderStatus()", 2000);
        }
      },
      //Ajax请求超时,继续查询
      error: function (e) {
        setTimeout("checkOrderStatus()", 2000);
      }
    });
  }

  function clock() {
    let timeout = new Date({{.ExpirationTime}});
    let now = new Date();
    let ms = timeout.getTime() - now.getTime();//时间差的毫秒数
    let second = Math.round(ms / 1000);
    let minute = Math.floor(second / 60);
    let hour = Math.floor(minute / 60);
    if(minute > 60) minute %= 60
    if (ms <= 0) {
      layer.alert("支付超时,请重新发起支付!");
      return;
    }
    $("#divTime").html("有效时间:<small style='color:red; font-size:30px'>" + hour + "</small>时<small style='color:red; font-size:30px'>" + minute + "</small>分<small style='color:red; font-size:30px'>" + (second % 60) + "</small>秒,失效勿付");
    return setTimeout(clock, 1000);
  }
  setTimeout(clock, 1000);

  window.onload = checkOrderStatus();
</script>
</body></html>


上一篇: Windows11全新系统安装如何跳过强制登陆微软账户才能进入系统,烦得很!
下一篇: 简单强大的截图工具faststone Capture

评论

精彩评论

评论 (0)

pc广告位
sitemap