web_huangguo2_h5/app/template/pages/feedback.html

<!DOCTYPE html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>{{.metaTitle}}</title>
  {{template "seoCommon" .}}
  <link rel="stylesheet" href="/static/css/base.css">
  <link rel="stylesheet" href="/static/css/feedback.css">
</head>
<body class="page-feedback">
  {{template "header" .}}

  <header class="page-subheader only-h5" aria-label="意见反馈顶栏">
    <a class="page-subheader__btn" href="javascript:history.back()" aria-label="返回">
      <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/chevron-left.svg" alt="返回">
    </a>
    <div class="page-subheader__title">意见反馈</div>
    <span class="page-subheader__btn" aria-hidden="true"></span>
  </header>

  <div class="page feedback-page">
    <main class="main feedback-main">
      <section class="feedback-hero" aria-label="意见反馈">
        <p class="eyebrow">
          <span class="eyebrow__bar" aria-hidden="true"></span>
          意见反馈
        </p>
        <h1 class="feedback-hero__title">告诉我们哪里可以更好</h1>
        <p class="feedback-hero__desc">播放问题、账号与支付、内容举报或功能建议，我们都会认真处理。</p>
      </section>

      <section class="feedback-layout" aria-label="反馈表单">
        <form class="feedback-form" action="#" method="post" data-feedback-form>
          <div class="feedback-form__field">
            <span class="feedback-form__label">问题类型</span>
            <div class="feedback-form__types" role="radiogroup" aria-label="问题类型">
              <label class="feedback-type is-active">
                <input type="radio" name="type" value="play" checked>
                播放问题
              </label>
              <label class="feedback-type">
                <input type="radio" name="type" value="account">
                账号与支付
              </label>
              <label class="feedback-type">
                <input type="radio" name="type" value="report">
                内容举报
              </label>
              <label class="feedback-type">
                <input type="radio" name="type" value="suggest">
                功能建议
              </label>
              <label class="feedback-type">
                <input type="radio" name="type" value="other">
                其他
              </label>
            </div>
          </div>

          <label class="feedback-form__field">
            <span class="feedback-form__label">问题描述</span>
            <span class="feedback-form__textarea-wrap">
              <textarea
                class="feedback-form__textarea"
                name="content"
                maxlength="500"
                rows="6"
                placeholder="请描述遇到的问题、发生的页面与操作步骤，越具体越好"
                data-feedback-content
                required
              ></textarea>
              <span class="feedback-form__count"><span data-feedback-count>0</span> / 500</span>
            </span>
          </label>

          <div class="feedback-form__field">
            <span class="feedback-form__label">截图（选填，最多 3 张，支持 jpg / png / gif）</span>
            <div class="feedback-uploads" data-feedback-uploads>
              <label class="feedback-upload feedback-upload--add">
                <input type="file" accept=".jpg,.jpeg,.png,.gif,image/jpeg,image/png,image/gif" multiple hidden data-feedback-file>
                <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/plus-dim.svg" alt="添加图片" aria-hidden="true">
                <span>上传截图</span>
              </label>
            </div>
          </div>

          <label class="feedback-form__field">
            <span class="feedback-form__label">联系方式（选填）</span>
            <span class="feedback-form__control">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/mail-dim.svg" alt="联系邮箱" aria-hidden="true">
              <input
                class="feedback-form__input"
                type="text"
                name="contact"
                autocomplete="email"
                placeholder="邮箱或手机号，方便我们回复你"
              >
            </span>
          </label>

          <div class="feedback-form__foot">
            <button class="btn btn--primary feedback-form__submit" type="submit">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/send.svg" alt="发送">
              提交反馈
            </button>
            <p class="feedback-form__hint">提交后可在 个人中心 / 我的反馈 查看处理进度</p>
          </div>
        </form>

        <aside class="feedback-aside" aria-label="帮助与联系">
          <div class="feedback-aside__card only-pc">
            <h2 class="feedback-aside__title">先看看这些是否有帮助</h2>
            <a class="feedback-aside__link" href="/help">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/feedback/help-circle.svg" alt="帮助">
              黄果短剧网页版可以看全集吗？
            </a>
            <a class="feedback-aside__link" href="/help">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/feedback/help-circle.svg" alt="帮助">
              解锁过的剧集还需要再付费吗？
            </a>
            <a class="feedback-aside__link" href="/help">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/feedback/help-circle.svg" alt="帮助">
              如何充值金币？
            </a>
            <a class="feedback-aside__link" href="/help">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/feedback/help-circle.svg" alt="帮助">
              支持哪些支付方式？
            </a>
          </div>

          <div class="feedback-aside__card feedback-aside__card--muted">
            <h2 class="feedback-aside__title">其他联系方式</h2>
            {{if .config.GmailAddr}}
            <p class="feedback-aside__row">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/mail-dim.svg" alt="联系邮箱">
              <a href="mailto:{{.config.GmailAddr}}" rel="sponsored nofollow noopener">{{.config.GmailAddr}}</a>
            </p>
            {{end}}
            {{if .config.TelegramURL}}
            <p class="feedback-aside__row">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/send.svg" alt="发送">
              <a href="{{.config.TelegramURL}}" target="_blank" rel="sponsored nofollow noopener">Telegram{{if .config.TelegramHandle}}  {{.config.TelegramHandle}}{{end}}</a>
            </p>
            {{end}}
            <p class="feedback-aside__row">
              <img decoding="async" loading="lazy" class="icon" src="/static/images/placeholder.png?v=2" data-src="/static/images/clock-dim.svg" alt="发生时间">
              <span>工作日 10:00 至 22:00</span>
            </p>
          </div>
        </aside>
      </section>
    </main>
  </div>

  {{template "footer" .}}
  <script defer src="/static/js/pages/feedback.js?v=5"></script>
</body>
</html>