html格式化

刘帅

2026-09-28 feda65d4ad3ce700dd5072b58c5ed6ba53aef345

 cloud-server-other/src/main/resources/static/app-guide.html

@@ -1,6 +1,111 @@
<!doctype html>
<html lang="zh-CN"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover"><title>玩湃生活</title>
<style>body{margin:0;background:#f7f8fa;color:#172033;font:16px -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif}.wrap{max-width:540px;margin:auto;padding:24px 18px 42px}.banner{width:100%;border-radius:14px;margin:0 0 12px;display:block}.empty{height:180px;background:linear-gradient(135deg,#2468f2,#74a3ff);border-radius:14px}.name{font-size:25px;font-weight:700;margin:24px 0 8px}.desc{color:#667085;margin:0 0 28px}.open{width:100%;border:0;border-radius:24px;padding:14px;background:#2468f2;color:white;font-size:17px;font-weight:600}.tip{font-size:13px;color:#98a2b3;text-align:center;margin-top:14px}</style></head>
<body><main class="wrap"><div id="banners" class="empty"></div><h1 id="appName" class="name">玩湃生活</h1><p class="desc">下载 APP，畅享便捷订场服务</p><button class="open" onclick="openApp()">打开 APP</button><p id="tip" class="tip"></p></main>
<script>var cfg={},code=new URLSearchParams(location.search).get('code')||'',el=id=>document.getElementById(id);fetch(new URL('public/app-guide/config'+(code?'?code='+encodeURIComponent(code):''),location.href)).then(r=>r.json()).then(r=>{if(r.code!==200)throw Error(r.msg);cfg=r.data;document.title=cfg.appName;el('appName').textContent=cfg.appName;var bs=cfg.banners||[];if(bs.length){el('banners').className='';el('banners').innerHTML=bs.map(x=>'<img class="banner" src="'+x.imageUrl+'" alt="'+(x.title||'宣传图')+'">').join('')}}).catch(e=>el('tip').textContent=e.message);
function marketUrl(){var u=navigator.userAgent.toLowerCase(),m=cfg.androidMarketUrls||{},brand=/huawei|honor/.test(u)?'huawei':/xiaomi|redmi/.test(u)?'xiaomi':/oppo/.test(u)?'oppo':/vivo/.test(u)?'vivo':/samsung/.test(u)?'samsung':'';return (brand&&m[brand])||cfg.androidDefaultUrl||cfg.apkUrl}function openApp(){var t=cfg.target||{},q=Object.keys(t).filter(k=>t[k]!=null&&k!=='type'&&k!=='route').map(k=>k+'='+encodeURIComponent(t[k])).join('&');var scheme=(cfg.appScheme||'playpai')+'://'+(t.route||'home').replace(/^\//,'')+(q?'?'+q:'');location.href=scheme;setTimeout(function(){var u=navigator.userAgent.toLowerCase(),url=/iphone|ipad|ipod/.test(u)?cfg.iosStoreUrl:marketUrl();if(url)location.href=url;else el('tip').textContent='请在应用商店搜索下载 '+(cfg.appName||'玩湃生活')},1600)}</script></body></html>
<html lang="zh-CN">

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
  <title>玩湃生活</title>
  <style>
    body {
      margin: 0;
      background: #f7f8fa;
      color: #172033;
      font: 16px -apple-system, BlinkMacSystemFont, "PingFang SC", sans-serif
    }

    .wrap {
      max-width: 540px;
      margin: auto;
      padding: 24px 18px 42px
    }

    .banner {
      width: 100%;
      border-radius: 14px;
      margin: 0 0 12px;
      display: block
    }

    .empty {
      height: 180px;
      background: linear-gradient(135deg, #2468f2, #74a3ff);
      border-radius: 14px
    }

    .name {
      font-size: 25px;
      font-weight: 700;
      margin: 24px 0 8px
    }

    .desc {
      color: #667085;
      margin: 0 0 28px
    }

    .open {
      width: 100%;
      border: 0;
      border-radius: 24px;
      padding: 14px;
      background: #2468f2;
      color: white;
      font-size: 17px;
      font-weight: 600
    }

    .tip {
      font-size: 13px;
      color: #98a2b3;
      text-align: center;
      margin-top: 14px
    }
  </style>
</head>

<body>
  <main class="wrap">
    <div id="banners" class="empty"></div>
    <h1 id="appName" class="name">玩湃生活</h1>
    <p class="desc">下载 APP，畅享便捷订场服务</p><button class="open" onclick="openApp()">打开 APP</button>
    <p id="tip" class="tip"></p>
  </main>
  <script>
    var cfg = {},
      code = new URLSearchParams(location.search).get('code') || '',
      el = id => document.getElementById(id);
    fetch(new URL('public/app-guide/config' + (code ? '?code=' + encodeURIComponent(code) : ''), location.href)).then(r => r.json()).then(r => {
      if (r.code !== 200) throw Error(r.msg);
      cfg = r.data;
      document.title = cfg.appName;
      el('appName').textContent = cfg.appName;
      var bs = cfg.banners || [];
      if (bs.length) {
        el('banners').className = '';
        el('banners').innerHTML = bs.map(x => '<img class="banner" src="' + x.imageUrl + '" alt="' + (x.title || '宣传图') + '">').join('')
      }
    }).catch(e => el('tip').textContent = e.message);

    function marketUrl() {
      var u = navigator.userAgent.toLowerCase(),
        m = cfg.androidMarketUrls || {},
        brand = /huawei|honor/.test(u) ? 'huawei' : /xiaomi|redmi/.test(u) ? 'xiaomi' : /oppo/.test(u) ? 'oppo' : /vivo/.test(u) ? 'vivo' : /samsung/.test(u) ? 'samsung' : '';
      return (brand && m[brand]) || cfg.androidDefaultUrl || cfg.apkUrl
    }

    function openApp() {
      var t = cfg.target || {},
        q = Object.keys(t).filter(k => t[k] != null && k !== 'type' && k !== 'route').map(k => k + '=' + encodeURIComponent(t[k])).join('&');
      var scheme = (cfg.appScheme || 'playpai') + '://' + (t.route || 'home').replace(/^\//, '') + (q ? '?' + q : '');
      location.href = scheme;
      setTimeout(function() {
        var u = navigator.userAgent.toLowerCase(),
          url = /iphone|ipad|ipod/.test(u) ? cfg.iosStoreUrl : marketUrl();
        if (url) location.href = url;
        else el('tip').textContent = '请在应用商店搜索下载 ' + (cfg.appName || '玩湃生活')
      }, 1600)
    }
  </script>
</body>

</html>