{{template "layout.html" .}}
<div class="card" style="max-width:640px">
  <div class="card-hd">网站配置</div>
  <div class="card-bd">
    <form id="websiteForm">
      <div class="fg">
        <label>网站名称</label>
        <input type="text" name="site_name" class="fctrl" value="{{.site_name}}">
      </div>
      <div class="fg">
        <label>副标题</label>
        <input type="text" name="site_subtitle" class="fctrl" value="{{.site_subtitle}}" placeholder="网站副标题或一句话描述">
      </div>
      <div class="fg">
        <label>网站 URL</label>
        <input type="text" name="site_url" class="fctrl" value="{{.site_url}}">
      </div>
      <div class="fg">
        <label>关键词</label>
        <input type="text" name="site_keywords" class="fctrl" value="{{.site_keywords}}">
      </div>
      <div class="fg">
        <label>描述</label>
        <textarea name="site_description" class="fctrl" rows="3">{{.site_description}}</textarea>
      </div>
      <div class="fr">
        <div class="fg half">
          <label>ICP 备案号</label>
          <input type="text" name="site_icp" class="fctrl" value="{{.site_icp}}">
        </div>
        <div class="fg half">
          <label>每页条数</label>
          <input type="number" name="page_size" class="fctrl" value="{{.page_size}}">
        </div>
      </div>
      <div class="fg">
        <label>Logo</label>
        <div class="ug">
          <input type="text" name="site_logo" class="fctrl" id="logoInput" value="{{.site_logo}}" placeholder="上传或输入Logo URL">
          <button type="button" class="btn btn-info" onclick="uploadLogo()">上传</button>
        </div>
        <img id="logoPreview" src="{{.site_logo}}" style="max-width:200px;margin-top:8px;border-radius:6px;{{if not .site_logo}}display:none{{end}}" onerror="this.style.display='none'">
      </div>
      <div class="fg">
        <label>Favicon</label>
        <div class="ug">
          <input type="text" name="site_favicon" class="fctrl" id="faviconInput" value="{{.site_favicon}}" placeholder="上传或输入Favicon URL（.ico 格式）">
          <button type="button" class="btn btn-info" onclick="uploadFavicon()">上传</button>
        </div>
        <img id="faviconPreview" src="{{.site_favicon}}" style="max-width:32px;margin-top:8px;{{if not .site_favicon}}display:none{{end}}" onerror="this.style.display='none'">
      </div>
      <div class="fg" style="border-top:1px solid var(--gray-100);padding-top:16px;margin-top:8px">
        <label style="font-weight:600;color:var(--gray-500);font-size:12px;text-transform:uppercase;letter-spacing:.5px">API 接口</label>
        <div style="display:flex;align-items:center;gap:10px;padding-top:8px">
          <input type="checkbox" name="site_openapi" value="1"{{if eq .site_openapi 1}} checked{{end}} style="width:18px;height:18px;accent-color:var(--primary)">
          <span style="font-size:14px">启用 OpenAPI 接口</span>
          <span style="font-size:12px;color:var(--gray-400)">开启后可通过 <code>/openapi/...</code> 以 JSON 格式访问内容数据</span>
        </div>
      </div>
      <div class="fg" style="border-top:1px solid var(--gray-100);padding-top:16px;margin-top:8px">
        <label style="font-weight:600;color:var(--gray-500);font-size:12px;text-transform:uppercase;letter-spacing:.5px">公司信息</label>
      </div>
      <div class="fg">
        <label>联系人</label>
        <input type="text" name="site_contact_person" class="fctrl" value="{{.site_contact_person}}" placeholder="联系人姓名">
      </div>
      <div class="fg">
        <label>联系方式</label>
        <input type="text" name="site_contact" class="fctrl" value="{{.site_contact}}" placeholder="电话 / 邮箱">
      </div>
      <div class="fg">
        <label>联系地址</label>
        <input type="text" name="site_address" class="fctrl" value="{{.site_address}}" placeholder="公司地址">
      </div>
      <div class="fg">
        <label>尾部信息</label>
        <input type="text" name="site_footer_info" class="fctrl" value="{{.site_footer_info}}" placeholder="显示在页脚上方的提示文字">
      </div>
      <div class="fg">
        <label>统计脚本</label>
        <textarea name="site_script" class="fctrl" rows="4" placeholder="CNZZ/Google Analytics 等统计代码，将插入到页面底部">{{.site_script}}</textarea>
      </div>
      <div style="padding-top:6px">
        <button type="submit" class="btn btn-primary">保存配置</button>
      </div>
    </form>
  </div>
</div>
<script>
function uploadFavicon(){
  var i=document.createElement('input');i.type='file';i.accept='image/x-icon,image/png,image/gif';
  i.onchange=function(){
    var f=new FormData();f.append('file',this.files[0]);
    fetch('/admin/upload',{method:'POST',body:f})
      .then(function(r){return r.json()})
      .then(function(d){
        if(d.code===0){document.getElementById('faviconInput').value=d.data.url;var img=document.getElementById('faviconPreview');img.src=d.data.url;img.style.display='block';toast('上传成功','success')}
        else{toast(d.msg,'error')}});
  };i.click()
}
function uploadLogo(){
  var i=document.createElement('input');i.type='file';i.accept='image/*';
  i.onchange=function(){
    var f=new FormData();f.append('file',this.files[0]);
    fetch('/admin/upload',{method:'POST',body:f})
      .then(function(r){return r.json()})
      .then(function(d){
        if(d.code===0){document.getElementById('logoInput').value=d.data.url;var img=document.getElementById('logoPreview');img.src=d.data.url;img.style.display='block';toast('上传成功','success')}
        else{toast(d.msg,'error')}});
  };i.click()
}
document.getElementById('websiteForm').addEventListener('submit',function(e){
  e.preventDefault();var btn=this.querySelector('button[type="submit"]');btn.disabled=true;btn.textContent='保存中…';
  fetch('/admin/config/website',{method:'POST',body:new FormData(this)})
    .then(function(r){return r.json()})
    .then(function(d){
      btn.disabled=false;btn.textContent='保存配置';
      var ov=document.createElement('div');
      ov.style.cssText='position:fixed;inset:0;background:rgba(15,23,42,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center;font-family:system-ui,sans-serif';
      if(d.code===0){
        ov.innerHTML='<div style="background:#fff;border-radius:12px;padding:36px 32px;min-width:300px;box-shadow:0 20px 60px rgba(0,0,0,.18);text-align:center"><div style="font-size:48px;margin-bottom:12px">✅</div><h3 style="margin:0 0 6px;font-size:18px;color:#1e293b">保存成功</h3><p style="margin:0 0 20px;color:#6B7280;font-size:14px">'+d.msg+'</p><button class="btn btn-primary" id="resultOk" style="cursor:pointer">确定</button></div>';
      }else{
        ov.innerHTML='<div style="background:#fff;border-radius:12px;padding:36px 32px;min-width:300px;box-shadow:0 20px 60px rgba(0,0,0,.18);text-align:center"><div style="font-size:48px;margin-bottom:12px">❌</div><h3 style="margin:0 0 6px;font-size:18px;color:#dc2626">保存失败</h3><p style="margin:0 0 20px;color:#6B7280;font-size:14px">'+d.msg+'</p><button class="btn btn-primary" id="resultOk" style="cursor:pointer">确定</button></div>';
      }
      document.body.appendChild(ov);
      document.getElementById('resultOk').onclick=function(){ov.remove()};
      ov.onclick=function(e){if(e.target===ov)ov.remove()};
    })
    .catch(function(){
      btn.disabled=false;btn.textContent='保存配置';
      var ov=document.createElement('div');
      ov.style.cssText='position:fixed;inset:0;background:rgba(15,23,42,.3);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:9999;display:flex;align-items:center;justify-content:center;font-family:system-ui,sans-serif';
      ov.innerHTML='<div style="background:#fff;border-radius:12px;padding:36px 32px;min-width:300px;box-shadow:0 20px 60px rgba(0,0,0,.18);text-align:center"><div style="font-size:48px;margin-bottom:12px">⚠️</div><h3 style="margin:0 0 6px;font-size:18px;color:#dc2626">请求失败</h3><p style="margin:0 0 20px;color:#6B7280;font-size:14px">网络错误，请检查网络连接后重试</p><button class="btn btn-primary" id="resultOk" style="cursor:pointer">确定</button></div>';
      document.body.appendChild(ov);
      document.getElementById('resultOk').onclick=function(){ov.remove()};
      ov.onclick=function(e){if(e.target===ov)ov.remove()};
    });
});
</script>
    </div>
  </div>

</body>
</html>