index.html 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. <!DOCTYPE HTML>
  2. <html lang="zh-CN">
  3. <head>
  4. <title>FeHelper弹出页面</title>
  5. <meta charset="utf-8">
  6. <link rel="stylesheet" href="index.css" />
  7. <script type="text/javascript" src="../static/vendor/evalCore.min.js"></script>
  8. <script type="text/javascript" src="../static/vendor/vue/vue.js"></script>
  9. </head>
  10. <body>
  11. <div id="pageContainer" class="fe-whole-page" :class="getLayoutClasses()">
  12. <div class="fe-function-title">FeHelper<span>({{manifest.version}})</span></div>
  13. <!-- 加载状态 -->
  14. <div v-if="isLoading" class="fe-loading">
  15. <div class="loading-spinner"></div>
  16. <div class="loading-text">加载工具列表中...</div>
  17. </div>
  18. <!-- 工具列表 -->
  19. <ul v-else-if="installedToolsCount > 0" class="fe-function-list" :class="{'few-tools': installedToolsCount <= 3}">
  20. <li v-for="tool in Object.keys(fhTools)" :class="'-x-' + tool" @click="runHelper(tool)" v-if="fhTools[tool].installed">
  21. <b>{{ fhTools[tool].icon || fhTools[tool].menuConfig[0].icon}}</b>{{fhTools[tool].name}}
  22. </li>
  23. </ul>
  24. <!-- 如果没有工具 -->
  25. <div v-else-if="!isLoading" class="fe-no-tools">
  26. <div class="no-tools-message">
  27. <p>暂无已安装的工具</p>
  28. <button @click="openOptionsPage()" class="install-tools-btn">去安装工具</button>
  29. </div>
  30. </div>
  31. <div class="fe-feedback">
  32. <a href="https://github.com/zxlie/FeHelper/issues" @click="openUrl($event)" target="_blank" tabindex="-1" class="x-github" title="提交意见反馈">
  33. <svg version="1.1" width="14" height="14" viewBox="0 0 426.667 426.667" style="enable-background:new 0 0 426.667 426.667;" xml:space="preserve">
  34. <path d="M384,0H42.667C19.093,0,0.213,19.093,0.213,42.667L0,426.667l85.333-85.333H384c23.573,0,42.667-19.093,42.667-42.667v-256C426.667,19.093,407.573,0,384,0z M234.667,256H192v-42.667h42.667V256z M234.667,170.667H192V85.333h42.667V170.667z"/>
  35. </svg>反馈
  36. </a>
  37. <span class="x-settings" @click="openOptionsPage()" title="FeHelper配置">
  38. <svg aria-hidden="true" height="16" version="1.1" viewBox="0 0 14 16" width="14">
  39. <path fill="currentColor" d="M12 2H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2zm-1 9H5V9h6v2zm0-4H5V5h6v2z"/>
  40. </svg>更多</span>
  41. </div>
  42. </div>
  43. <script src="../static/js/dark-mode.js"></script>
  44. <script type="module" src="index.js"></script>
  45. </body>
  46. </html>