zhuohongkui 1 rok temu
rodzic
commit
52cc5339d0
44 zmienionych plików z 2042 dodań i 858 usunięć
  1. 1323 777
      public/pdf/web/viewer.html
  2. 11 1
      src/App.vue
  3. BIN
      src/assets/icon/下载_白色.png
  4. BIN
      src/assets/icon/下载_蓝色.png
  5. BIN
      src/assets/icon/回到顶部.png
  6. 4 0
      src/common/service.js
  7. 1 1
      src/components/card/card-module/card-file-detail.vue
  8. 1 4
      src/components/card/image-text/my-release-card.vue
  9. 1 4
      src/components/card/information/my-release-card.vue
  10. 1 4
      src/components/card/video/my-release-card.vue
  11. 2 2
      src/components/layout/Header.vue
  12. 7 5
      src/components/layout/Navbar.vue
  13. 19 4
      src/components/module/comment.vue
  14. 6 5
      src/components/module/contribute/contribute-tab.vue
  15. 289 0
      src/components/module/invoice-header-select.vue
  16. 11 1
      src/components/module/invoice.vue
  17. 17 2
      src/components/module/report.vue
  18. 50 0
      src/components/module/to-top.vue
  19. 1 1
      src/components/video/video-all-card.vue
  20. 6 4
      src/components/vip/order-card.vue
  21. 7 0
      src/router/vip-routes.js
  22. 10 1
      src/views/image-text/children/comment-on-my.vue
  23. 1 1
      src/views/image-text/children/my-collect.vue
  24. 1 1
      src/views/image-text/children/my-like.vue
  25. 10 1
      src/views/image-text/children/reply-on-my.vue
  26. 1 1
      src/views/image-text/image-text-detail.vue
  27. 0 5
      src/views/image-text/index.vue
  28. 10 1
      src/views/information/children/comment-on-my.vue
  29. 1 1
      src/views/information/children/my-collect.vue
  30. 3 1
      src/views/information/children/my-like.vue
  31. 17 10
      src/views/information/children/reply-on-my.vue
  32. 0 5
      src/views/information/index.vue
  33. 7 3
      src/views/information/information-collection.vue
  34. 3 1
      src/views/information/information-detail.vue
  35. 10 1
      src/views/video/children/comment-on-my.vue
  36. 2 1
      src/views/video/children/my-collect.vue
  37. 2 1
      src/views/video/children/my-like.vue
  38. 10 1
      src/views/video/children/reply-on-my.vue
  39. 1 0
      src/views/video/components/child-content.vue
  40. 1 1
      src/views/video/components/content.vue
  41. 0 4
      src/views/video/index.vue
  42. 1 0
      src/views/video/video-detail.vue
  43. 7 2
      src/views/vip/vip-invoice-apply.vue
  44. 187 0
      src/views/vip/vip-invoice-detail.vue

+ 1323 - 777
public/pdf/web/viewer.html

@@ -21,863 +21,1409 @@ Adobe CMap resources are covered by their own copyright but the same license:
 See https://github.com/adobe-type-tools/cmap-resources
 -->
 <html dir="ltr" mozdisallowselectionprint>
-
-<head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
-    <meta name="google" content="notranslate">
-    <meta http-equiv="Content-Type" content="text/html" charset="gb2312">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8"/>
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1, maximum-scale=1"
+    />
+    <meta name="google" content="notranslate" />
+    <meta http-equiv="Content-Type" content="text/html" charset="gb2312" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" charset="utf-8" />
     <title>PDF.js viewer</title>
 
-    <link rel="stylesheet" href="viewer.css">
+    <link rel="stylesheet" href="viewer.css" />
 
     <!-- This snippet is used in production (included from viewer.html) -->
-    <link rel="resource" type="application/l10n" href="locale/locale.properties">
+    <link
+      rel="resource"
+      type="application/l10n"
+      href="locale/locale.properties"
+    />
 
-<!--    <script src="//cdn.bootcss.com/eruda/1.2.4/eruda.min.js"></script>-->
-<!--    <script>-->
-<!--        eruda.init();-->
-<!--    </script>-->
+    <!--    <script src="//cdn.bootcss.com/eruda/1.2.4/eruda.min.js"></script>-->
+    <!--    <script>-->
+    <!--        eruda.init();-->
+    <!--    </script>-->
 
     <script src="../core-js-3.29.1-minified.min.js"></script>
     <script>
-        const isNoCopy = false;
-        // 禁止右键菜单
-        document.oncontextmenu = function () {
-            return isNoCopy;
-        };
-        // 禁止文字选择
-        document.onselectstart = function () {
-            return isNoCopy;
-        };
-        // 禁止复制
-        document.oncopy = function () {
-            return isNoCopy;
-        };
-        // 禁止剪切
-        document.oncut = function () {
-            return isNoCopy;
-        };
-
-        window.onkeydown = window.onkeyup = window.onkeypress = function (event) {
+      const isNoCopy = false;
+      // 禁止右键菜单
+      document.oncontextmenu = function () {
+        return isNoCopy;
+      };
+      // 禁止文字选择
+      document.onselectstart = function () {
+        return isNoCopy;
+      };
+      // 禁止复制
+      document.oncopy = function () {
+        return isNoCopy;
+      };
+      // 禁止剪切
+      document.oncut = function () {
+        return isNoCopy;
+      };
+
+      window.onkeydown =
+        window.onkeyup =
+        window.onkeypress =
+          function (event) {
             // 禁止使用F12,判断是否按下F12,F12键码为123
             if (event.keyCode === 123) {
-                // 阻止默认事件
-                event.preventDefault();
-                window.event.returnValue = false;
+              // 阻止默认事件
+              event.preventDefault();
+              window.event.returnValue = false;
             }
             // 禁用 ctrl + s 与 command + s
-            if ((event.ctrlKey || event.metaKey) && event.key === 's') {
-                // 阻止默认事件
-                event.preventDefault()
-                window.event.returnValue = false;
+            if ((event.ctrlKey || event.metaKey) && event.key === "s") {
+              // 阻止默认事件
+              event.preventDefault();
+              window.event.returnValue = false;
             }
-        };
-
-        function disableContextMenu(e) {
-            e.preventDefault();
+          };
+
+      function disableContextMenu(e) {
+        e.preventDefault();
+      }
+
+      document.addEventListener("visibilitychange", function () {
+        if (document.hidden) {
+          // 取消禁用鼠标右键事件
+          document.removeEventListener("contextmenu", disableContextMenu);
+        } else {
+          // 禁用鼠标右键事件
+          document.addEventListener("contextmenu", disableContextMenu);
         }
+      });
 
-        document.addEventListener("visibilitychange", function () {
-            if (document.hidden) {
-                // 取消禁用鼠标右键事件
-                document.removeEventListener("contextmenu", disableContextMenu);
-            } else {
-                // 禁用鼠标右键事件
-                document.addEventListener("contextmenu", disableContextMenu);
-            }
-        });
-
-        function formatQueryString(query) {
-            const params = new Map();
-            for (const [key, value] of new URLSearchParams(query)) {
-                params.set(key.toLowerCase(), value);
-            }
-            return params;
+      function formatQueryString(query) {
+        const params = new Map();
+        for (const [key, value] of new URLSearchParams(query)) {
+          params.set(key.toLowerCase(), value);
         }
-
-        var watermarkText = formatQueryString(location.search).get('watermark_text');
-        var pdfIsEncrypt = parseInt(formatQueryString(location.search).get('is_encrypt') || 1);
+        return params;
+      }
+
+      var watermarkText = formatQueryString(location.search).get(
+        "watermark_text"
+      );
+      var pdfIsEncrypt = parseInt(
+        formatQueryString(location.search).get("is_encrypt") || 1
+      );
     </script>
     <script src="../build/pdf.js"></script>
-    <script>console.log('63783876')</script>
+    <script>
+      console.log("63783876");
+    </script>
     <script src="wasm_exec.js"></script>
     <script src="viewer.js"></script>
 
     <style>
-        .search-wrap {
-            width: 100%;
-            height: 58px;
-            display: flex;
-            align-items: center;
-            padding: 0 12px;
-            box-sizing: border-box;
-            background: #FFFFFF;
-            position: relative;
-            z-index: 900;
-        }
-
-        .search-box {
-            flex: 1;
-            height: 38px;
-            display: flex;
-            align-items: center;
-            background-color: #F3F3F3;
-            border-radius: 40px;
-            padding: 0 7px 0 14px;
-            box-sizing: border-box;
-            position: relative;
-        }
-
-        .historical-search {
-            width: 100%;
-            position: absolute;
-            left: 0;
-            top: 45px;
-            background-color: #F3F3F3;
-            border-radius: 10px;
-            padding: 10px;
-            box-sizing: border-box;
-            display: flex;
-            flex-wrap: wrap;
-            /*display: none;*/
-            z-index: 999;
-        }
-
-        .historical-search-mask {
-            position: fixed;
-            left: 0;
-            top: 58px;
-            width: 20%;
-            height: 100%;
-            /*background: rgba(0, 0, 0, .2);*/
-        }
-
-        .historical-search label {
-            -webkit-user-select: none;
-            -moz-user-select: none;
-            user-select: none;
-            margin-right: 40px;
-            display: block;
-        }
-
-        .historical-search label:hover,
-        .historical-search input:focus-visible + label {
-            color: var(--toggled-btn-color);
-            background-color: var(--button-hover-color);
-        }
-
-        .historical-search .toolbarField[type="checkbox"]:checked + .toolbarLabel {
-            background-color: var(--toggled-btn-bg-color) !important;
-            color: var(--toggled-btn-color);
-        }
-
-        .search-icon {
-            width: 24px;
-            margin-right: 10px;
-        }
-
-        .search-input {
-            width: auto !important;
-            flex: 1 !important;
-            height: 38px;
-            display: block;
-            border: none;
-            background: none;
-            font-size: 14px;
-            outline-style: none;
-        }
-
-        .search-input::placeholder {
-            color: #A7A7A7;
-        }
-
-        .direction-box {
-            width: 53px;
-            height: 24px;
-            border: 1px solid #979797;
-            border-radius: 40px;
-            display: flex;
-            align-items: center;
-        }
-
-        .direction-box > button {
-            flex: 1;
-            display: flex;
-            border: none;
-            margin: 0;
-            padding: 0;
-            justify-content: center;
-            align-items: center;
-            border-right: 1px solid #D8D8D8;
-            box-sizing: border-box;
-            background: none;
-        }
-
-        .direction-box > button:last-child {
-            border-right: none;
-        }
-
-        .direction-box > button > img {
-            width: 16px;
-        }
-
-        .tool-box {
-            margin-left: 3px;
-            display: flex;
-            align-items: center;
-        }
-
-        .tool-box > button {
-            border: none;
-            padding: 0 6px;
-            border-right: 1px solid #D8D8D8;
-            box-sizing: border-box;
-            background: none;
-        }
-
-        .tool-box > button:last-child {
-            padding-right: 0;
-        }
-
-        .tool-box > button:last-child {
-            border-right: none;
-        }
-
-        .tool-box > button > img {
-            width: 26px;
-        }
-
-        .catalogue-btn {
-            color: #FFFFFF;
-            font-size: 13px;
-            font-weight: bold;
-            width: 72px;
-            height: 28px;
-            background-color: #2A63F3;
-            border-radius: 40px;
-            display: flex;
-            justify-content: center;
-            align-items: center;
-            position: fixed;
-            top: 70%;
-            left: 12px;
-            z-index: 904;
-            border: none;
-        }
-
-        .catalogue-btn > img {
-            width: 14px;
-            margin-right: 3px;
-        }
-
-        #sidebarContainer {
-            /*position: fixed;*/
-            top: 0;
-            z-index: 903;
-        }
-
-        #sidebarContainerMask {
-            position: fixed;
-            top: 0;
-            left: 0;
-            width: 20%;
-            height: 100%;
-            /*background: rgba(0, 0, 0, .2);*/
-            z-index: 902;
-            display: none;
-        }
-
-        .sidebarOpen #sidebarContainerMask {
-            display: block;
-        }
-
-        .search-box .historical-search,
-        .search-box .historical-search-mask {
-            display: none;
-        }
-
-        .search-box.focus .historical-search,
-        .search-box.focus .historical-search-mask {
-            display: flex;
-        }
+      .search-wrap {
+        width: 100%;
+        height: 58px;
+        display: flex;
+        align-items: center;
+        padding: 0 12px;
+        box-sizing: border-box;
+        background: #ffffff;
+        position: relative;
+        z-index: 900;
+      }
+
+      .search-box {
+        flex: 1;
+        height: 38px;
+        display: flex;
+        align-items: center;
+        background-color: #f3f3f3;
+        border-radius: 40px;
+        padding: 0 7px 0 14px;
+        box-sizing: border-box;
+        position: relative;
+      }
+
+      .historical-search {
+        width: 100%;
+        position: absolute;
+        left: 0;
+        top: 45px;
+        background-color: #f3f3f3;
+        border-radius: 10px;
+        padding: 10px;
+        box-sizing: border-box;
+        display: flex;
+        flex-wrap: wrap;
+        /*display: none;*/
+        z-index: 999;
+      }
+
+      .historical-search-mask {
+        position: fixed;
+        left: 0;
+        top: 58px;
+        width: 20%;
+        height: 100%;
+        /*background: rgba(0, 0, 0, .2);*/
+      }
+
+      .historical-search label {
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        user-select: none;
+        margin-right: 40px;
+        display: block;
+      }
+
+      .historical-search label:hover,
+      .historical-search input:focus-visible + label {
+        color: var(--toggled-btn-color);
+        background-color: var(--button-hover-color);
+      }
+
+      .historical-search
+        .toolbarField[type="checkbox"]:checked
+        + .toolbarLabel {
+        background-color: var(--toggled-btn-bg-color) !important;
+        color: var(--toggled-btn-color);
+      }
+
+      .search-icon {
+        width: 24px;
+        margin-right: 10px;
+      }
+
+      .search-input {
+        width: auto !important;
+        flex: 1 !important;
+        height: 38px;
+        display: block;
+        border: none;
+        background: none;
+        font-size: 14px;
+        outline-style: none;
+      }
+
+      .search-input::placeholder {
+        color: #a7a7a7;
+      }
+
+      .direction-box {
+        width: 53px;
+        height: 24px;
+        border: 1px solid #979797;
+        border-radius: 40px;
+        display: flex;
+        align-items: center;
+      }
+
+      .direction-box > button {
+        flex: 1;
+        display: flex;
+        border: none;
+        margin: 0;
+        padding: 0;
+        justify-content: center;
+        align-items: center;
+        border-right: 1px solid #d8d8d8;
+        box-sizing: border-box;
+        background: none;
+      }
+
+      .direction-box > button:last-child {
+        border-right: none;
+      }
+
+      .direction-box > button > img {
+        width: 16px;
+      }
+
+      .tool-box {
+        margin-left: 3px;
+        display: flex;
+        align-items: center;
+      }
+
+      .tool-box > button {
+        border: none;
+        padding: 0 6px;
+        border-right: 1px solid #d8d8d8;
+        box-sizing: border-box;
+        background: none;
+      }
+
+      .tool-box > button:last-child {
+        padding-right: 0;
+      }
+
+      .tool-box > button:last-child {
+        border-right: none;
+      }
+
+      .tool-box > button > img {
+        width: 26px;
+      }
+
+      .catalogue-btn {
+        color: #ffffff;
+        font-size: 13px;
+        font-weight: bold;
+        width: 72px;
+        height: 28px;
+        background-color: #2a63f3;
+        border-radius: 40px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        position: fixed;
+        top: 70%;
+        left: 12px;
+        z-index: 904;
+        border: none;
+      }
+
+      .catalogue-btn > img {
+        width: 14px;
+        margin-right: 3px;
+      }
+
+      #sidebarContainer {
+        /*position: fixed;*/
+        top: 0;
+        z-index: 903;
+      }
+
+      #sidebarContainerMask {
+        position: fixed;
+        top: 0;
+        left: 0;
+        width: 20%;
+        height: 100%;
+        /*background: rgba(0, 0, 0, .2);*/
+        z-index: 902;
+        display: none;
+      }
+
+      .sidebarOpen #sidebarContainerMask {
+        display: block;
+      }
+
+      .search-box .historical-search,
+      .search-box .historical-search-mask {
+        display: none;
+      }
+
+      .search-box.focus .historical-search,
+      .search-box.focus .historical-search-mask {
+        display: flex;
+      }
     </style>
-
-</head>
-
-<body tabindex="1">
-
-<div id="outerContainer">
-    <button
-            type="button"
-            class="catalogue-btn"
-            id="sidebarToggle"
-            data-l10n-id="toggle_sidebar"
-            aria-expanded="false"
-            aria-controls="sidebarContainer"
-    >
-        <img src="./img/icon-128.png" alt="">
+  </head>
+
+  <body tabindex="1">
+    <div id="outerContainer">
+      <button
+        type="button"
+        class="catalogue-btn"
+        id="sidebarToggle"
+        data-l10n-id="toggle_sidebar"
+        aria-expanded="false"
+        aria-controls="sidebarContainer"
+      >
+        <img src="./img/icon-128.png" alt="" />
         目录
-    </button>
-    <div class="search-wrap">
+      </button>
+      <div class="search-wrap">
         <div class="search-box" id="search-box">
-            <img src="./img/icon-115.png" class="search-icon" alt="">
-            <input
-                    type="text"
-                    id="findInput"
-                    class="search-input"
-                    placeholder="在文档中查找…"
-                    data-l10n-id="find_input"
-                    aria-invalid="false"
-                    autocomplete="off"
-            />
-            <div class="direction-box">
-                <button type="button" id="findPrevious" data-l10n-id="find_input">
-                    <img src="./img/icon-116.png" alt="">
-                </button>
-                <button type="button" id="findNext" data-l10n-id="find_next">
-                    <img src="./img/icon-117.png" alt="">
-                </button>
+          <img src="./img/icon-115.png" class="search-icon" alt="" />
+          <input
+            type="text"
+            id="findInput"
+            class="search-input"
+            placeholder="在文档中查找…"
+            data-l10n-id="find_input"
+            aria-invalid="false"
+            autocomplete="off"
+          />
+          <div class="direction-box">
+            <button type="button" id="findPrevious" data-l10n-id="find_input">
+              <img src="./img/icon-116.png" alt="" />
+            </button>
+            <button type="button" id="findNext" data-l10n-id="find_next">
+              <img src="./img/icon-117.png" alt="" />
+            </button>
+          </div>
+          <div class="historical-search-mask" id="historical-search-mask"></div>
+          <div class="historical-search">
+            <div id="findbarOptionsOneContainer">
+              <input
+                type="checkbox"
+                id="findHighlightAll"
+                class="toolbarField"
+                tabindex="94"
+              />
+              <label
+                for="findHighlightAll"
+                class="toolbarLabel"
+                data-l10n-id="find_highlight"
+                >Highlight All</label
+              >
+              <input
+                type="checkbox"
+                id="findMatchCase"
+                class="toolbarField"
+                tabindex="95"
+              />
+              <label
+                for="findMatchCase"
+                class="toolbarLabel"
+                data-l10n-id="find_match_case_label"
+                >Match Case</label
+              >
             </div>
-            <div class="historical-search-mask" id="historical-search-mask"></div>
-            <div class="historical-search">
-                <div id="findbarOptionsOneContainer">
-                    <input type="checkbox" id="findHighlightAll" class="toolbarField" tabindex="94">
-                    <label for="findHighlightAll" class="toolbarLabel" data-l10n-id="find_highlight">Highlight
-                        All</label>
-                    <input type="checkbox" id="findMatchCase" class="toolbarField" tabindex="95">
-                    <label for="findMatchCase" class="toolbarLabel" data-l10n-id="find_match_case_label">Match
-                        Case</label>
-                </div>
-                <div id="findbarOptionsTwoContainer">
-                    <input type="checkbox" id="findMatchDiacritics" class="toolbarField" tabindex="96">
-                    <label for="findMatchDiacritics" class="toolbarLabel" data-l10n-id="find_match_diacritics_label">Match
-                        Diacritics</label>
-                    <input type="checkbox" id="findEntireWord" class="toolbarField" tabindex="97">
-                    <label for="findEntireWord" class="toolbarLabel" data-l10n-id="find_entire_word_label">Whole
-                        Words</label>
-                </div>
-                <div id="findbarMessageContainer" aria-live="polite">
-                    <span id="findResultsCount" class="toolbarLabel"></span>
-                    <span id="findMsg" class="toolbarLabel"></span>
-                </div>
+            <div id="findbarOptionsTwoContainer">
+              <input
+                type="checkbox"
+                id="findMatchDiacritics"
+                class="toolbarField"
+                tabindex="96"
+              />
+              <label
+                for="findMatchDiacritics"
+                class="toolbarLabel"
+                data-l10n-id="find_match_diacritics_label"
+                >Match Diacritics</label
+              >
+              <input
+                type="checkbox"
+                id="findEntireWord"
+                class="toolbarField"
+                tabindex="97"
+              />
+              <label
+                for="findEntireWord"
+                class="toolbarLabel"
+                data-l10n-id="find_entire_word_label"
+                >Whole Words</label
+              >
             </div>
+            <div id="findbarMessageContainer" aria-live="polite">
+              <span id="findResultsCount" class="toolbarLabel"></span>
+              <span id="findMsg" class="toolbarLabel"></span>
+            </div>
+          </div>
         </div>
         <div class="tool-box">
-            <button type="button" id="zoomOut">
-                <img src="./img/icon-118.png" alt="">
-            </button>
-            <button type="button" id="zoomIn">
-                <img src="./img/icon-119.png" alt="">
-            </button>
+          <button type="button" id="zoomOut">
+            <img src="./img/icon-118.png" alt="" />
+          </button>
+          <button type="button" id="zoomIn">
+            <img src="./img/icon-119.png" alt="" />
+          </button>
         </div>
-    </div>
-    <script>
-        const searchBox = document.getElementById('search-box');
+      </div>
+      <script>
+        const searchBox = document.getElementById("search-box");
         const findInput = document.getElementById("findInput");
-        const historicalSearchMask = document.getElementById('historical-search-mask');
-        findInput.addEventListener('focus', function () {
-            console.log(123,searchBox.classList);
-            if(searchBox.classList.length==2){
-                searchBox.classList.remove('focus');
-            }else{
-                searchBox.classList.add('focus');
-            }
-            
+        const historicalSearchMask = document.getElementById(
+          "historical-search-mask"
+        );
+        findInput.addEventListener("focus", function () {
+          console.log(123, searchBox.classList);
+          if (searchBox.classList.length == 2) {
+            searchBox.classList.remove("focus");
+          } else {
+            searchBox.classList.add("focus");
+          }
         });
-        findInput.addEventListener('blur', function () {
-                setTimeout(() => {
-                    searchBox.classList.remove('focus');
-                }, 1000);
-            
+        findInput.addEventListener("blur", function () {
+          setTimeout(() => {
+            searchBox.classList.remove("focus");
+          }, 1000);
         });
-       
-        historicalSearchMask.addEventListener('click', function () {
-            searchBox.classList.remove('focus');
+
+        historicalSearchMask.addEventListener("click", function () {
+          searchBox.classList.remove("focus");
         });
-    </script>
-    <div id="sidebarContainerMask"></div>
-    <div id="sidebarContainer">
+      </script>
+      <div id="sidebarContainerMask"></div>
+      <div id="sidebarContainer">
         <div id="toolbarSidebar">
-            <div id="toolbarSidebarLeft">
-                <div id="sidebarViewButtons" class="splitToolbarButton toggled" role="radiogroup">
-                    <button id="viewThumbnail" class="toolbarButton toggled" title="Show Thumbnails" tabindex="2"
-                            data-l10n-id="thumbs" role="radio" aria-checked="true" aria-controls="thumbnailView">
-                        <span data-l10n-id="thumbs_label">Thumbnails</span>
-                    </button>
-                    <button id="viewOutline" class="toolbarButton"
-                            title="Show Document Outline (double-click to expand/collapse all items)" tabindex="3"
-                            data-l10n-id="document_outline" role="radio" aria-checked="false"
-                            aria-controls="outlineView">
-                        <span data-l10n-id="document_outline_label">Document Outline</span>
-                    </button>
-                    <button id="viewAttachments" class="toolbarButton" title="Show Attachments" tabindex="4"
-                            data-l10n-id="attachments" role="radio" aria-checked="false"
-                            aria-controls="attachmentsView">
-                        <span data-l10n-id="attachments_label">Attachments</span>
-                    </button>
-                    <button id="viewLayers" class="toolbarButton"
-                            title="Show Layers (double-click to reset all layers to the default state)" tabindex="5"
-                            data-l10n-id="layers" role="radio" aria-checked="false" aria-controls="layersView">
-                        <span data-l10n-id="layers_label">Layers</span>
-                    </button>
-                </div>
+          <div id="toolbarSidebarLeft">
+            <div
+              id="sidebarViewButtons"
+              class="splitToolbarButton toggled"
+              role="radiogroup"
+            >
+              <button
+                id="viewThumbnail"
+                class="toolbarButton toggled"
+                title="Show Thumbnails"
+                tabindex="2"
+                data-l10n-id="thumbs"
+                role="radio"
+                aria-checked="true"
+                aria-controls="thumbnailView"
+              >
+                <span data-l10n-id="thumbs_label">Thumbnails</span>
+              </button>
+              <button
+                id="viewOutline"
+                class="toolbarButton"
+                title="Show Document Outline (double-click to expand/collapse all items)"
+                tabindex="3"
+                data-l10n-id="document_outline"
+                role="radio"
+                aria-checked="false"
+                aria-controls="outlineView"
+              >
+                <span data-l10n-id="document_outline_label"
+                  >Document Outline</span
+                >
+              </button>
+              <button
+                id="viewAttachments"
+                class="toolbarButton"
+                title="Show Attachments"
+                tabindex="4"
+                data-l10n-id="attachments"
+                role="radio"
+                aria-checked="false"
+                aria-controls="attachmentsView"
+              >
+                <span data-l10n-id="attachments_label">Attachments</span>
+              </button>
+              <button
+                id="viewLayers"
+                class="toolbarButton"
+                title="Show Layers (double-click to reset all layers to the default state)"
+                tabindex="5"
+                data-l10n-id="layers"
+                role="radio"
+                aria-checked="false"
+                aria-controls="layersView"
+              >
+                <span data-l10n-id="layers_label">Layers</span>
+              </button>
             </div>
-
-            <div id="toolbarSidebarRight">
-                <div id="outlineOptionsContainer" class="hidden">
-                    <div class="verticalToolbarSeparator"></div>
-
-                    <button id="currentOutlineItem" class="toolbarButton" disabled="disabled"
-                            title="Find Current Outline Item"
-                            tabindex="6" data-l10n-id="current_outline_item">
-                        <span data-l10n-id="current_outline_item_label">Current Outline Item</span>
-                    </button>
-                </div>
+          </div>
+
+          <div id="toolbarSidebarRight">
+            <div id="outlineOptionsContainer" class="hidden">
+              <div class="verticalToolbarSeparator"></div>
+
+              <button
+                id="currentOutlineItem"
+                class="toolbarButton"
+                disabled="disabled"
+                title="Find Current Outline Item"
+                tabindex="6"
+                data-l10n-id="current_outline_item"
+              >
+                <span data-l10n-id="current_outline_item_label"
+                  >Current Outline Item</span
+                >
+              </button>
             </div>
+          </div>
         </div>
         <div id="sidebarContent">
-            <div id="thumbnailView">
-            </div>
-            <div id="outlineView" class="hidden">
-            </div>
-            <div id="attachmentsView" class="hidden">
-            </div>
-            <div id="layersView" class="hidden">
-            </div>
+          <div id="thumbnailView"></div>
+          <div id="outlineView" class="hidden"></div>
+          <div id="attachmentsView" class="hidden"></div>
+          <div id="layersView" class="hidden"></div>
         </div>
         <div id="sidebarResizer"></div>
-    </div> <!-- sidebarContainer -->
+      </div>
+      <!-- sidebarContainer -->
 
-    <div id="mainContainer">
+      <div id="mainContainer">
         <div class="findbar hidden doorHanger" id="findbar">
-            <div id="findbarInputContainer">
-                <input id="findInput" class="toolbarField" title="Find" placeholder="Find in document…" tabindex="91"
-                       data-l10n-id="find_input" aria-invalid="false">
-                <div class="splitToolbarButton">
-                    <button id="findPrevious" class="toolbarButton" title="Find the previous occurrence of the phrase"
-                            tabindex="92" data-l10n-id="find_previous">
-                        <span data-l10n-id="find_previous_label">Previous</span>
-                    </button>
-                    <div class="splitToolbarButtonSeparator"></div>
-                    <button id="findNext" class="toolbarButton" title="Find the next occurrence of the phrase"
-                            tabindex="93"
-                            data-l10n-id="find_next">
-                        <span data-l10n-id="find_next_label">Next</span>
-                    </button>
-                </div>
+          <div id="findbarInputContainer">
+            <input
+              id="findInput"
+              class="toolbarField"
+              title="Find"
+              placeholder="Find in document…"
+              tabindex="91"
+              data-l10n-id="find_input"
+              aria-invalid="false"
+            />
+            <div class="splitToolbarButton">
+              <button
+                id="findPrevious"
+                class="toolbarButton"
+                title="Find the previous occurrence of the phrase"
+                tabindex="92"
+                data-l10n-id="find_previous"
+              >
+                <span data-l10n-id="find_previous_label">Previous</span>
+              </button>
+              <div class="splitToolbarButtonSeparator"></div>
+              <button
+                id="findNext"
+                class="toolbarButton"
+                title="Find the next occurrence of the phrase"
+                tabindex="93"
+                data-l10n-id="find_next"
+              >
+                <span data-l10n-id="find_next_label">Next</span>
+              </button>
             </div>
+          </div>
 
-            <div id="findbarOptionsOneContainer">
-                <input type="checkbox" id="findHighlightAll" class="toolbarField" tabindex="94">
-                <label for="findHighlightAll" class="toolbarLabel" data-l10n-id="find_highlight">Highlight All</label>
-                <input type="checkbox" id="findMatchCase" class="toolbarField" tabindex="95">
-                <label for="findMatchCase" class="toolbarLabel" data-l10n-id="find_match_case_label">Match Case</label>
+          <div id="findbarOptionsOneContainer">
+            <input
+              type="checkbox"
+              id="findHighlightAll"
+              class="toolbarField"
+              tabindex="94"
+            />
+            <label
+              for="findHighlightAll"
+              class="toolbarLabel"
+              data-l10n-id="find_highlight"
+              >Highlight All</label
+            >
+            <input
+              type="checkbox"
+              id="findMatchCase"
+              class="toolbarField"
+              tabindex="95"
+            />
+            <label
+              for="findMatchCase"
+              class="toolbarLabel"
+              data-l10n-id="find_match_case_label"
+              >Match Case</label
+            >
+          </div>
+          <div id="findbarOptionsTwoContainer">
+            <input
+              type="checkbox"
+              id="findMatchDiacritics"
+              class="toolbarField"
+              tabindex="96"
+            />
+            <label
+              for="findMatchDiacritics"
+              class="toolbarLabel"
+              data-l10n-id="find_match_diacritics_label"
+              >Match Diacritics</label
+            >
+            <input
+              type="checkbox"
+              id="findEntireWord"
+              class="toolbarField"
+              tabindex="97"
+            />
+            <label
+              for="findEntireWord"
+              class="toolbarLabel"
+              data-l10n-id="find_entire_word_label"
+              >Whole Words</label
+            >
+          </div>
+
+          <div id="findbarMessageContainer" aria-live="polite">
+            <span id="findResultsCount" class="toolbarLabel"></span>
+            <span id="findMsg" class="toolbarLabel"></span>
+          </div>
+        </div>
+        <!-- findbar -->
+
+        <div
+          class="editorParamsToolbar hidden doorHangerRight"
+          id="editorFreeTextParamsToolbar"
+        >
+          <div class="editorParamsToolbarContainer">
+            <div class="editorParamsSetter">
+              <label
+                for="editorFreeTextColor"
+                class="editorParamsLabel"
+                data-l10n-id="editor_free_text_color"
+                >Color</label
+              >
+              <input
+                type="color"
+                id="editorFreeTextColor"
+                class="editorParamsColor"
+                tabindex="100"
+              />
             </div>
-            <div id="findbarOptionsTwoContainer">
-                <input type="checkbox" id="findMatchDiacritics" class="toolbarField" tabindex="96">
-                <label for="findMatchDiacritics" class="toolbarLabel" data-l10n-id="find_match_diacritics_label">Match
-                    Diacritics</label>
-                <input type="checkbox" id="findEntireWord" class="toolbarField" tabindex="97">
-                <label for="findEntireWord" class="toolbarLabel" data-l10n-id="find_entire_word_label">Whole
-                    Words</label>
+            <div class="editorParamsSetter">
+              <label
+                for="editorFreeTextFontSize"
+                class="editorParamsLabel"
+                data-l10n-id="editor_free_text_size"
+                >Size</label
+              >
+              <input
+                type="range"
+                id="editorFreeTextFontSize"
+                class="editorParamsSlider"
+                value="10"
+                min="5"
+                max="100"
+                step="1"
+                tabindex="101"
+              />
             </div>
+          </div>
+        </div>
 
-            <div id="findbarMessageContainer" aria-live="polite">
-                <span id="findResultsCount" class="toolbarLabel"></span>
-                <span id="findMsg" class="toolbarLabel"></span>
+        <div
+          class="editorParamsToolbar hidden doorHangerRight"
+          id="editorInkParamsToolbar"
+        >
+          <div class="editorParamsToolbarContainer">
+            <div class="editorParamsSetter">
+              <label
+                for="editorInkColor"
+                class="editorParamsLabel"
+                data-l10n-id="editor_ink_color"
+                >Color</label
+              >
+              <input
+                type="color"
+                id="editorInkColor"
+                class="editorParamsColor"
+                tabindex="102"
+              />
             </div>
-        </div> <!-- findbar -->
-
-        <div class="editorParamsToolbar hidden doorHangerRight" id="editorFreeTextParamsToolbar">
-            <div class="editorParamsToolbarContainer">
-                <div class="editorParamsSetter">
-                    <label for="editorFreeTextColor" class="editorParamsLabel"
-                           data-l10n-id="editor_free_text_color">Color</label>
-                    <input type="color" id="editorFreeTextColor" class="editorParamsColor" tabindex="100">
-                </div>
-                <div class="editorParamsSetter">
-                    <label for="editorFreeTextFontSize" class="editorParamsLabel"
-                           data-l10n-id="editor_free_text_size">Size</label>
-                    <input type="range" id="editorFreeTextFontSize" class="editorParamsSlider" value="10" min="5"
-                           max="100"
-                           step="1" tabindex="101">
-                </div>
+            <div class="editorParamsSetter">
+              <label
+                for="editorInkThickness"
+                class="editorParamsLabel"
+                data-l10n-id="editor_ink_thickness"
+                >Thickness</label
+              >
+              <input
+                type="range"
+                id="editorInkThickness"
+                class="editorParamsSlider"
+                value="1"
+                min="1"
+                max="20"
+                step="1"
+                tabindex="103"
+              />
             </div>
-        </div>
-
-        <div class="editorParamsToolbar hidden doorHangerRight" id="editorInkParamsToolbar">
-            <div class="editorParamsToolbarContainer">
-                <div class="editorParamsSetter">
-                    <label for="editorInkColor" class="editorParamsLabel" data-l10n-id="editor_ink_color">Color</label>
-                    <input type="color" id="editorInkColor" class="editorParamsColor" tabindex="102">
-                </div>
-                <div class="editorParamsSetter">
-                    <label for="editorInkThickness" class="editorParamsLabel"
-                           data-l10n-id="editor_ink_thickness">Thickness</label>
-                    <input type="range" id="editorInkThickness" class="editorParamsSlider" value="1" min="1" max="20"
-                           step="1"
-                           tabindex="103">
-                </div>
-                <div class="editorParamsSetter">
-                    <label for="editorInkOpacity" class="editorParamsLabel"
-                           data-l10n-id="editor_ink_opacity">Opacity</label>
-                    <input type="range" id="editorInkOpacity" class="editorParamsSlider" value="100" min="1" max="100"
-                           step="1"
-                           tabindex="104">
-                </div>
+            <div class="editorParamsSetter">
+              <label
+                for="editorInkOpacity"
+                class="editorParamsLabel"
+                data-l10n-id="editor_ink_opacity"
+                >Opacity</label
+              >
+              <input
+                type="range"
+                id="editorInkOpacity"
+                class="editorParamsSlider"
+                value="100"
+                min="1"
+                max="100"
+                step="1"
+                tabindex="104"
+              />
             </div>
+          </div>
         </div>
 
-        <div id="secondaryToolbar" class="secondaryToolbar hidden doorHangerRight">
-            <div id="secondaryToolbarButtonContainer">
-                <button id="secondaryOpenFile" class="secondaryToolbarButton visibleLargeView" title="Open File"
-                        tabindex="51"
-                        data-l10n-id="open_file">
-                    <span data-l10n-id="open_file_label">Open</span>
-                </button>
-
-                <button id="secondaryPrint" class="secondaryToolbarButton visibleMediumView" title="Print" tabindex="52"
-                        data-l10n-id="print">
-                    <span data-l10n-id="print_label">Print</span>
-                </button>
+        <div
+          id="secondaryToolbar"
+          class="secondaryToolbar hidden doorHangerRight"
+        >
+          <div id="secondaryToolbarButtonContainer">
+            <button
+              id="secondaryOpenFile"
+              class="secondaryToolbarButton visibleLargeView"
+              title="Open File"
+              tabindex="51"
+              data-l10n-id="open_file"
+            >
+              <span data-l10n-id="open_file_label">Open</span>
+            </button>
 
-                <button id="secondaryDownload" class="secondaryToolbarButton visibleMediumView" title="Save"
-                        tabindex="53"
-                        data-l10n-id="save">
-                    <span data-l10n-id="save_label">Save</span>
-                </button>
+            <button
+              id="secondaryPrint"
+              class="secondaryToolbarButton visibleMediumView"
+              title="Print"
+              tabindex="52"
+              data-l10n-id="print"
+            >
+              <span data-l10n-id="print_label">Print</span>
+            </button>
 
-                <div class="horizontalToolbarSeparator visibleLargeView"></div>
+            <button
+              id="secondaryDownload"
+              class="secondaryToolbarButton visibleMediumView"
+              title="Save"
+              tabindex="53"
+              data-l10n-id="save"
+            >
+              <span data-l10n-id="save_label">Save</span>
+            </button>
 
-                <button id="presentationMode" class="secondaryToolbarButton" title="Switch to Presentation Mode"
-                        tabindex="54"
-                        data-l10n-id="presentation_mode">
-                    <span data-l10n-id="presentation_mode_label">Presentation Mode</span>
-                </button>
+            <div class="horizontalToolbarSeparator visibleLargeView"></div>
+
+            <button
+              id="presentationMode"
+              class="secondaryToolbarButton"
+              title="Switch to Presentation Mode"
+              tabindex="54"
+              data-l10n-id="presentation_mode"
+            >
+              <span data-l10n-id="presentation_mode_label"
+                >Presentation Mode</span
+              >
+            </button>
 
-                <a href="#" id="viewBookmark" class="secondaryToolbarButton"
-                   title="Current view (copy or open in new window)"
-                   tabindex="55" data-l10n-id="bookmark">
-                    <span data-l10n-id="bookmark_label">Current View</span>
-                </a>
+            <a
+              href="#"
+              id="viewBookmark"
+              class="secondaryToolbarButton"
+              title="Current view (copy or open in new window)"
+              tabindex="55"
+              data-l10n-id="bookmark"
+            >
+              <span data-l10n-id="bookmark_label">Current View</span>
+            </a>
+
+            <div class="horizontalToolbarSeparator"></div>
+
+            <button
+              id="firstPage"
+              class="secondaryToolbarButton"
+              title="Go to First Page"
+              tabindex="56"
+              data-l10n-id="first_page"
+            >
+              <span data-l10n-id="first_page_label">Go to First Page</span>
+            </button>
+            <button
+              id="lastPage"
+              class="secondaryToolbarButton"
+              title="Go to Last Page"
+              tabindex="57"
+              data-l10n-id="last_page"
+            >
+              <span data-l10n-id="last_page_label">Go to Last Page</span>
+            </button>
 
-                <div class="horizontalToolbarSeparator"></div>
+            <div class="horizontalToolbarSeparator"></div>
 
-                <button id="firstPage" class="secondaryToolbarButton" title="Go to First Page" tabindex="56"
-                        data-l10n-id="first_page">
-                    <span data-l10n-id="first_page_label">Go to First Page</span>
-                </button>
-                <button id="lastPage" class="secondaryToolbarButton" title="Go to Last Page" tabindex="57"
-                        data-l10n-id="last_page">
-                    <span data-l10n-id="last_page_label">Go to Last Page</span>
-                </button>
+            <button
+              id="pageRotateCw"
+              class="secondaryToolbarButton"
+              title="Rotate Clockwise"
+              tabindex="58"
+              data-l10n-id="page_rotate_cw"
+            >
+              <span data-l10n-id="page_rotate_cw_label">Rotate Clockwise</span>
+            </button>
+            <button
+              id="pageRotateCcw"
+              class="secondaryToolbarButton"
+              title="Rotate Counterclockwise"
+              tabindex="59"
+              data-l10n-id="page_rotate_ccw"
+            >
+              <span data-l10n-id="page_rotate_ccw_label"
+                >Rotate Counterclockwise</span
+              >
+            </button>
 
-                <div class="horizontalToolbarSeparator"></div>
+            <div class="horizontalToolbarSeparator"></div>
+
+            <div id="cursorToolButtons" role="radiogroup">
+              <button
+                id="cursorSelectTool"
+                class="secondaryToolbarButton toggled"
+                title="Enable Text Selection Tool"
+                tabindex="60"
+                data-l10n-id="cursor_text_select_tool"
+                role="radio"
+                aria-checked="true"
+              >
+                <span data-l10n-id="cursor_text_select_tool_label"
+                  >Text Selection Tool</span
+                >
+              </button>
+              <button
+                id="cursorHandTool"
+                class="secondaryToolbarButton"
+                title="Enable Hand Tool"
+                tabindex="61"
+                data-l10n-id="cursor_hand_tool"
+                role="radio"
+                aria-checked="false"
+              >
+                <span data-l10n-id="cursor_hand_tool_label">Hand Tool</span>
+              </button>
+            </div>
 
-                <button id="pageRotateCw" class="secondaryToolbarButton" title="Rotate Clockwise" tabindex="58"
-                        data-l10n-id="page_rotate_cw">
-                    <span data-l10n-id="page_rotate_cw_label">Rotate Clockwise</span>
-                </button>
-                <button id="pageRotateCcw" class="secondaryToolbarButton" title="Rotate Counterclockwise" tabindex="59"
-                        data-l10n-id="page_rotate_ccw">
-                    <span data-l10n-id="page_rotate_ccw_label">Rotate Counterclockwise</span>
-                </button>
+            <div class="horizontalToolbarSeparator"></div>
+
+            <div id="scrollModeButtons" role="radiogroup">
+              <button
+                id="scrollPage"
+                class="secondaryToolbarButton"
+                title="Use Page Scrolling"
+                tabindex="62"
+                data-l10n-id="scroll_page"
+                role="radio"
+                aria-checked="false"
+              >
+                <span data-l10n-id="scroll_page_label">Page Scrolling</span>
+              </button>
+              <button
+                id="scrollVertical"
+                class="secondaryToolbarButton toggled"
+                title="Use Vertical Scrolling"
+                tabindex="63"
+                data-l10n-id="scroll_vertical"
+                role="radio"
+                aria-checked="true"
+              >
+                <span data-l10n-id="scroll_vertical_label"
+                  >Vertical Scrolling</span
+                >
+              </button>
+              <button
+                id="scrollHorizontal"
+                class="secondaryToolbarButton"
+                title="Use Horizontal Scrolling"
+                tabindex="64"
+                data-l10n-id="scroll_horizontal"
+                role="radio"
+                aria-checked="false"
+              >
+                <span data-l10n-id="scroll_horizontal_label"
+                  >Horizontal Scrolling</span
+                >
+              </button>
+              <button
+                id="scrollWrapped"
+                class="secondaryToolbarButton"
+                title="Use Wrapped Scrolling"
+                tabindex="65"
+                data-l10n-id="scroll_wrapped"
+                role="radio"
+                aria-checked="false"
+              >
+                <span data-l10n-id="scroll_wrapped_label"
+                  >Wrapped Scrolling</span
+                >
+              </button>
+            </div>
 
-                <div class="horizontalToolbarSeparator"></div>
-
-                <div id="cursorToolButtons" role="radiogroup">
-                    <button id="cursorSelectTool" class="secondaryToolbarButton toggled"
-                            title="Enable Text Selection Tool"
-                            tabindex="60" data-l10n-id="cursor_text_select_tool" role="radio" aria-checked="true">
-                        <span data-l10n-id="cursor_text_select_tool_label">Text Selection Tool</span>
-                    </button>
-                    <button id="cursorHandTool" class="secondaryToolbarButton" title="Enable Hand Tool" tabindex="61"
-                            data-l10n-id="cursor_hand_tool" role="radio" aria-checked="false">
-                        <span data-l10n-id="cursor_hand_tool_label">Hand Tool</span>
-                    </button>
-                </div>
+            <div class="horizontalToolbarSeparator"></div>
+
+            <div id="spreadModeButtons" role="radiogroup">
+              <button
+                id="spreadNone"
+                class="secondaryToolbarButton toggled"
+                title="Do not join page spreads"
+                tabindex="66"
+                data-l10n-id="spread_none"
+                role="radio"
+                aria-checked="true"
+              >
+                <span data-l10n-id="spread_none_label">No Spreads</span>
+              </button>
+              <button
+                id="spreadOdd"
+                class="secondaryToolbarButton"
+                title="Join page spreads starting with odd-numbered pages"
+                tabindex="67"
+                data-l10n-id="spread_odd"
+                role="radio"
+                aria-checked="false"
+              >
+                <span data-l10n-id="spread_odd_label">Odd Spreads</span>
+              </button>
+              <button
+                id="spreadEven"
+                class="secondaryToolbarButton"
+                title="Join page spreads starting with even-numbered pages"
+                tabindex="68"
+                data-l10n-id="spread_even"
+                role="radio"
+                aria-checked="false"
+              >
+                <span data-l10n-id="spread_even_label">Even Spreads</span>
+              </button>
+            </div>
 
-                <div class="horizontalToolbarSeparator"></div>
-
-                <div id="scrollModeButtons" role="radiogroup">
-                    <button id="scrollPage" class="secondaryToolbarButton" title="Use Page Scrolling" tabindex="62"
-                            data-l10n-id="scroll_page" role="radio" aria-checked="false">
-                        <span data-l10n-id="scroll_page_label">Page Scrolling</span>
-                    </button>
-                    <button id="scrollVertical" class="secondaryToolbarButton toggled" title="Use Vertical Scrolling"
-                            tabindex="63" data-l10n-id="scroll_vertical" role="radio" aria-checked="true">
-                        <span data-l10n-id="scroll_vertical_label">Vertical Scrolling</span>
-                    </button>
-                    <button id="scrollHorizontal" class="secondaryToolbarButton" title="Use Horizontal Scrolling"
-                            tabindex="64"
-                            data-l10n-id="scroll_horizontal" role="radio" aria-checked="false">
-                        <span data-l10n-id="scroll_horizontal_label">Horizontal Scrolling</span>
-                    </button>
-                    <button id="scrollWrapped" class="secondaryToolbarButton" title="Use Wrapped Scrolling"
-                            tabindex="65"
-                            data-l10n-id="scroll_wrapped" role="radio" aria-checked="false">
-                        <span data-l10n-id="scroll_wrapped_label">Wrapped Scrolling</span>
-                    </button>
-                </div>
+            <div class="horizontalToolbarSeparator"></div>
+
+            <button
+              id="documentProperties"
+              class="secondaryToolbarButton"
+              title="Document Properties…"
+              tabindex="69"
+              data-l10n-id="document_properties"
+              aria-controls="documentPropertiesDialog"
+            >
+              <span data-l10n-id="document_properties_label"
+                >Document Properties…</span
+              >
+            </button>
+          </div>
+        </div>
+        <!-- secondaryToolbar -->
 
-                <div class="horizontalToolbarSeparator"></div>
-
-                <div id="spreadModeButtons" role="radiogroup">
-                    <button id="spreadNone" class="secondaryToolbarButton toggled" title="Do not join page spreads"
-                            tabindex="66" data-l10n-id="spread_none" role="radio" aria-checked="true">
-                        <span data-l10n-id="spread_none_label">No Spreads</span>
-                    </button>
-                    <button id="spreadOdd" class="secondaryToolbarButton"
-                            title="Join page spreads starting with odd-numbered pages" tabindex="67"
-                            data-l10n-id="spread_odd"
-                            role="radio" aria-checked="false">
-                        <span data-l10n-id="spread_odd_label">Odd Spreads</span>
-                    </button>
-                    <button id="spreadEven" class="secondaryToolbarButton"
-                            title="Join page spreads starting with even-numbered pages" tabindex="68"
-                            data-l10n-id="spread_even"
-                            role="radio" aria-checked="false">
-                        <span data-l10n-id="spread_even_label">Even Spreads</span>
-                    </button>
+        <div class="toolbar">
+          <div id="toolbarContainer" style="display: none">
+            <div id="toolbarViewer">
+              <div id="toolbarViewerLeft">
+                <!--                        <button id="sidebarToggle" class="toolbarButton" title="Toggle Sidebar" tabindex="11"-->
+                <!--                                data-l10n-id="toggle_sidebar" aria-expanded="false" aria-controls="sidebarContainer">-->
+                <!--                            <span data-l10n-id="toggle_sidebar_label">Toggle Sidebar</span>-->
+                <!--                        </button>-->
+                <div class="toolbarButtonSpacer"></div>
+                <button
+                  id="viewFind"
+                  class="toolbarButton"
+                  title="Find in Document"
+                  tabindex="12"
+                  data-l10n-id="findbar"
+                  aria-expanded="false"
+                  aria-controls="findbar"
+                >
+                  <span data-l10n-id="findbar_label">Find</span>
+                </button>
+                <div class="splitToolbarButton hiddenSmallView">
+                  <button
+                    class="toolbarButton"
+                    title="Previous Page"
+                    id="previous"
+                    tabindex="13"
+                    data-l10n-id="previous"
+                  >
+                    <span data-l10n-id="previous_label">Previous</span>
+                  </button>
+                  <div class="splitToolbarButtonSeparator"></div>
+                  <button
+                    class="toolbarButton"
+                    title="Next Page"
+                    id="next"
+                    tabindex="14"
+                    data-l10n-id="next"
+                  >
+                    <span data-l10n-id="next_label">Next</span>
+                  </button>
                 </div>
+                <input
+                  type="number"
+                  id="pageNumber"
+                  class="toolbarField"
+                  title="Page"
+                  value="1"
+                  min="1"
+                  tabindex="15"
+                  data-l10n-id="page"
+                  autocomplete="off"
+                />
+                <span id="numPages" class="toolbarLabel"></span>
+              </div>
+              <div id="toolbarViewerRight" style="display: none">
+                <button
+                  id="openFile"
+                  class="toolbarButton hiddenLargeView"
+                  title="Open File"
+                  tabindex="31"
+                  data-l10n-id="open_file"
+                >
+                  <span data-l10n-id="open_file_label">Open</span>
+                </button>
 
-                <div class="horizontalToolbarSeparator"></div>
+                <button
+                  id="print"
+                  class="toolbarButton hiddenMediumView"
+                  title="Print"
+                  tabindex="32"
+                  data-l10n-id="print"
+                >
+                  <span data-l10n-id="print_label">Print</span>
+                </button>
 
-                <button id="documentProperties" class="secondaryToolbarButton" title="Document Properties…"
-                        tabindex="69"
-                        data-l10n-id="document_properties" aria-controls="documentPropertiesDialog">
-                    <span data-l10n-id="document_properties_label">Document Properties…</span>
+                <button
+                  id="download"
+                  class="toolbarButton hiddenMediumView"
+                  title="Save"
+                  tabindex="33"
+                  data-l10n-id="save"
+                >
+                  <span data-l10n-id="save_label">Save</span>
                 </button>
-            </div>
-        </div> <!-- secondaryToolbar -->
 
-        <div class="toolbar">
-            <div id="toolbarContainer" style="display: none">
-                <div id="toolbarViewer">
-                    <div id="toolbarViewerLeft">
-                        <!--                        <button id="sidebarToggle" class="toolbarButton" title="Toggle Sidebar" tabindex="11"-->
-                        <!--                                data-l10n-id="toggle_sidebar" aria-expanded="false" aria-controls="sidebarContainer">-->
-                        <!--                            <span data-l10n-id="toggle_sidebar_label">Toggle Sidebar</span>-->
-                        <!--                        </button>-->
-                        <div class="toolbarButtonSpacer"></div>
-                        <button id="viewFind" class="toolbarButton" title="Find in Document" tabindex="12"
-                                data-l10n-id="findbar"
-                                aria-expanded="false" aria-controls="findbar">
-                            <span data-l10n-id="findbar_label">Find</span>
-                        </button>
-                        <div class="splitToolbarButton hiddenSmallView">
-                            <button class="toolbarButton" title="Previous Page" id="previous" tabindex="13"
-                                    data-l10n-id="previous">
-                                <span data-l10n-id="previous_label">Previous</span>
-                            </button>
-                            <div class="splitToolbarButtonSeparator"></div>
-                            <button class="toolbarButton" title="Next Page" id="next" tabindex="14" data-l10n-id="next">
-                                <span data-l10n-id="next_label">Next</span>
-                            </button>
-                        </div>
-                        <input type="number" id="pageNumber" class="toolbarField" title="Page" value="1" min="1"
-                               tabindex="15"
-                               data-l10n-id="page" autocomplete="off">
-                        <span id="numPages" class="toolbarLabel"></span>
-                    </div>
-                    <div id="toolbarViewerRight" style="display: none;">
-                        <button id="openFile" class="toolbarButton hiddenLargeView" title="Open File" tabindex="31"
-                                data-l10n-id="open_file">
-                            <span data-l10n-id="open_file_label">Open</span>
-                        </button>
-
-                        <button id="print" class="toolbarButton hiddenMediumView" title="Print" tabindex="32"
-                                data-l10n-id="print">
-                            <span data-l10n-id="print_label">Print</span>
-                        </button>
-
-                        <button id="download" class="toolbarButton hiddenMediumView" title="Save" tabindex="33"
-                                data-l10n-id="save">
-                            <span data-l10n-id="save_label">Save</span>
-                        </button>
-
-                        <div class="verticalToolbarSeparator hiddenMediumView"></div>
-
-                        <div id="editorModeButtons" class="splitToolbarButton toggled" role="radiogroup">
-                            <button id="editorFreeText" class="toolbarButton" disabled="disabled" title="Text"
-                                    role="radio"
-                                    aria-checked="false" tabindex="34" data-l10n-id="editor_free_text2">
-                                <span data-l10n-id="editor_free_text2_label">Text</span>
-                            </button>
-                            <button id="editorInk" class="toolbarButton" disabled="disabled" title="Draw" role="radio"
-                                    aria-checked="false" tabindex="35" data-l10n-id="editor_ink2">
-                                <span data-l10n-id="editor_ink2_label">Draw</span>
-                            </button>
-                        </div>
-
-                        <div id="editorModeSeparator" class="verticalToolbarSeparator"></div>
-
-                        <button id="secondaryToolbarToggle" class="toolbarButton" title="Tools" tabindex="48"
-                                data-l10n-id="tools"
-                                aria-expanded="false" aria-controls="secondaryToolbar">
-                            <span data-l10n-id="tools_label">Tools</span>
-                        </button>
-                    </div>
-                    <div id="toolbarViewerMiddle">
-                        <div class="splitToolbarButton">
-                            <button id="zoomOut" class="toolbarButton" title="Zoom Out" tabindex="21"
-                                    data-l10n-id="zoom_out">
-                                <span data-l10n-id="zoom_out_label">Zoom Out</span>
-                            </button>
-                            <div class="splitToolbarButtonSeparator"></div>
-                            <button id="zoomIn" class="toolbarButton" title="Zoom In" tabindex="22"
-                                    data-l10n-id="zoom_in">
-                                <span data-l10n-id="zoom_in_label">Zoom In</span>
-                            </button>
-                        </div>
-                        <span id="scaleSelectContainer" class="dropdownToolbarButton">
-                <select id="scaleSelect" title="Zoom" tabindex="23" data-l10n-id="zoom">
-                  <option id="pageAutoOption" title="" value="auto" selected="selected" data-l10n-id="page_scale_auto">
-                    Automatic Zoom</option>
-                  <option id="pageActualOption" title="" value="page-actual" data-l10n-id="page_scale_actual">Actual
-                    Size</option>
-                  <option id="pageFitOption" title="" value="page-fit" data-l10n-id="page_scale_fit">Page Fit</option>
-                  <option id="pageWidthOption" title="" value="page-width" data-l10n-id="page_scale_width">Page Width
-                  </option>
-                  <option id="customScaleOption" title="" value="custom" disabled="disabled" hidden="true"></option>
-                  <option title="" value="0.5" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 50 }'>50%
-                  </option>
-                  <option title="" value="0.75" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 75 }'>75%
-                  </option>
-                  <option title="" value="1" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 100 }'>100%
-                  </option>
-                  <option title="" value="1.25" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 125 }'>125%
-                  </option>
-                  <option title="" value="1.5" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 150 }'>150%
-                  </option>
-                  <option title="" value="2" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 200 }'>200%
-                  </option>
-                  <option title="" value="3" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 300 }'>300%
-                  </option>
-                  <option title="" value="4" data-l10n-id="page_scale_percent" data-l10n-args='{ "scale": 400 }'>400%
-                  </option>
-                </select>
-              </span>
-                    </div>
+                <div class="verticalToolbarSeparator hiddenMediumView"></div>
+
+                <div
+                  id="editorModeButtons"
+                  class="splitToolbarButton toggled"
+                  role="radiogroup"
+                >
+                  <button
+                    id="editorFreeText"
+                    class="toolbarButton"
+                    disabled="disabled"
+                    title="Text"
+                    role="radio"
+                    aria-checked="false"
+                    tabindex="34"
+                    data-l10n-id="editor_free_text2"
+                  >
+                    <span data-l10n-id="editor_free_text2_label">Text</span>
+                  </button>
+                  <button
+                    id="editorInk"
+                    class="toolbarButton"
+                    disabled="disabled"
+                    title="Draw"
+                    role="radio"
+                    aria-checked="false"
+                    tabindex="35"
+                    data-l10n-id="editor_ink2"
+                  >
+                    <span data-l10n-id="editor_ink2_label">Draw</span>
+                  </button>
                 </div>
-                <div id="loadingBar">
-                    <div class="progress">
-                        <div class="glimmer">
-                        </div>
-                    </div>
+
+                <div
+                  id="editorModeSeparator"
+                  class="verticalToolbarSeparator"
+                ></div>
+
+                <button
+                  id="secondaryToolbarToggle"
+                  class="toolbarButton"
+                  title="Tools"
+                  tabindex="48"
+                  data-l10n-id="tools"
+                  aria-expanded="false"
+                  aria-controls="secondaryToolbar"
+                >
+                  <span data-l10n-id="tools_label">Tools</span>
+                </button>
+              </div>
+              <div id="toolbarViewerMiddle">
+                <div class="splitToolbarButton">
+                  <button
+                    id="zoomOut"
+                    class="toolbarButton"
+                    title="Zoom Out"
+                    tabindex="21"
+                    data-l10n-id="zoom_out"
+                  >
+                    <span data-l10n-id="zoom_out_label">Zoom Out</span>
+                  </button>
+                  <div class="splitToolbarButtonSeparator"></div>
+                  <button
+                    id="zoomIn"
+                    class="toolbarButton"
+                    title="Zoom In"
+                    tabindex="22"
+                    data-l10n-id="zoom_in"
+                  >
+                    <span data-l10n-id="zoom_in_label">Zoom In</span>
+                  </button>
                 </div>
+                <span id="scaleSelectContainer" class="dropdownToolbarButton">
+                  <select
+                    id="scaleSelect"
+                    title="Zoom"
+                    tabindex="23"
+                    data-l10n-id="zoom"
+                  >
+                    <option
+                      id="pageAutoOption"
+                      title=""
+                      value="auto"
+                      selected="selected"
+                      data-l10n-id="page_scale_auto"
+                    >
+                      Automatic Zoom
+                    </option>
+                    <option
+                      id="pageActualOption"
+                      title=""
+                      value="page-actual"
+                      data-l10n-id="page_scale_actual"
+                    >
+                      Actual Size
+                    </option>
+                    <option
+                      id="pageFitOption"
+                      title=""
+                      value="page-fit"
+                      data-l10n-id="page_scale_fit"
+                    >
+                      Page Fit
+                    </option>
+                    <option
+                      id="pageWidthOption"
+                      title=""
+                      value="page-width"
+                      data-l10n-id="page_scale_width"
+                    >
+                      Page Width
+                    </option>
+                    <option
+                      id="customScaleOption"
+                      title=""
+                      value="custom"
+                      disabled="disabled"
+                      hidden="true"
+                    ></option>
+                    <option
+                      title=""
+                      value="0.5"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 50 }'
+                    >
+                      50%
+                    </option>
+                    <option
+                      title=""
+                      value="0.75"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 75 }'
+                    >
+                      75%
+                    </option>
+                    <option
+                      title=""
+                      value="1"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 100 }'
+                    >
+                      100%
+                    </option>
+                    <option
+                      title=""
+                      value="1.25"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 125 }'
+                    >
+                      125%
+                    </option>
+                    <option
+                      title=""
+                      value="1.5"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 150 }'
+                    >
+                      150%
+                    </option>
+                    <option
+                      title=""
+                      value="2"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 200 }'
+                    >
+                      200%
+                    </option>
+                    <option
+                      title=""
+                      value="3"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 300 }'
+                    >
+                      300%
+                    </option>
+                    <option
+                      title=""
+                      value="4"
+                      data-l10n-id="page_scale_percent"
+                      data-l10n-args='{ "scale": 400 }'
+                    >
+                      400%
+                    </option>
+                  </select>
+                </span>
+              </div>
+            </div>
+            <div id="loadingBar">
+              <div class="progress">
+                <div class="glimmer"></div>
+              </div>
             </div>
+          </div>
         </div>
 
         <div id="viewerContainer" tabindex="0" style="top: 58px">
-            <div id="viewer" class="pdfViewer"></div>
+          <div id="viewer" class="pdfViewer"></div>
         </div>
-    </div> <!-- mainContainer -->
+      </div>
+      <!-- mainContainer -->
 
-    <div id="dialogContainer">
+      <div id="dialogContainer">
         <dialog id="passwordDialog">
-            <div class="row">
-                <label for="password" id="passwordText" data-l10n-id="password_label">Enter the password to open this
-                    PDF
-                    file:</label>
-            </div>
-            <div class="row">
-                <input type="password" id="password" class="toolbarField">
-            </div>
-            <div class="buttonRow">
-                <button id="passwordCancel" class="dialogButton"><span data-l10n-id="password_cancel">Cancel</span>
-                </button>
-                <button id="passwordSubmit" class="dialogButton"><span data-l10n-id="password_ok">OK</span></button>
-            </div>
+          <div class="row">
+            <label
+              for="password"
+              id="passwordText"
+              data-l10n-id="password_label"
+              >Enter the password to open this PDF file:</label
+            >
+          </div>
+          <div class="row">
+            <input type="password" id="password" class="toolbarField" />
+          </div>
+          <div class="buttonRow">
+            <button id="passwordCancel" class="dialogButton">
+              <span data-l10n-id="password_cancel">Cancel</span>
+            </button>
+            <button id="passwordSubmit" class="dialogButton">
+              <span data-l10n-id="password_ok">OK</span>
+            </button>
+          </div>
         </dialog>
         <dialog id="documentPropertiesDialog">
-            <div class="row">
-                <span id="fileNameLabel" data-l10n-id="document_properties_file_name">File name:</span>
-                <p id="fileNameField" aria-labelledby="fileNameLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="fileSizeLabel" data-l10n-id="document_properties_file_size">File size:</span>
-                <p id="fileSizeField" aria-labelledby="fileSizeLabel">-</p>
-            </div>
-            <div class="separator"></div>
-            <div class="row">
-                <span id="titleLabel" data-l10n-id="document_properties_title">Title:</span>
-                <p id="titleField" aria-labelledby="titleLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="authorLabel" data-l10n-id="document_properties_author">Author:</span>
-                <p id="authorField" aria-labelledby="authorLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="subjectLabel" data-l10n-id="document_properties_subject">Subject:</span>
-                <p id="subjectField" aria-labelledby="subjectLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="keywordsLabel" data-l10n-id="document_properties_keywords">Keywords:</span>
-                <p id="keywordsField" aria-labelledby="keywordsLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="creationDateLabel" data-l10n-id="document_properties_creation_date">Creation Date:</span>
-                <p id="creationDateField" aria-labelledby="creationDateLabel">-</p>
-            </div>
-            <div class="row">
-          <span id="modificationDateLabel" data-l10n-id="document_properties_modification_date">Modification
-            Date:</span>
-                <p id="modificationDateField" aria-labelledby="modificationDateLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="creatorLabel" data-l10n-id="document_properties_creator">Creator:</span>
-                <p id="creatorField" aria-labelledby="creatorLabel">-</p>
-            </div>
-            <div class="separator"></div>
-            <div class="row">
-                <span id="producerLabel" data-l10n-id="document_properties_producer">PDF Producer:</span>
-                <p id="producerField" aria-labelledby="producerLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="versionLabel" data-l10n-id="document_properties_version">PDF Version:</span>
-                <p id="versionField" aria-labelledby="versionLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="pageCountLabel" data-l10n-id="document_properties_page_count">Page Count:</span>
-                <p id="pageCountField" aria-labelledby="pageCountLabel">-</p>
-            </div>
-            <div class="row">
-                <span id="pageSizeLabel" data-l10n-id="document_properties_page_size">Page Size:</span>
-                <p id="pageSizeField" aria-labelledby="pageSizeLabel">-</p>
-            </div>
-            <div class="separator"></div>
-            <div class="row">
-                <span id="linearizedLabel" data-l10n-id="document_properties_linearized">Fast Web View:</span>
-                <p id="linearizedField" aria-labelledby="linearizedLabel">-</p>
-            </div>
-            <div class="buttonRow">
-                <button id="documentPropertiesClose" class="dialogButton"><span
-                        data-l10n-id="document_properties_close">Close</span></button>
-            </div>
+          <div class="row">
+            <span
+              id="fileNameLabel"
+              data-l10n-id="document_properties_file_name"
+              >File name:</span
+            >
+            <p id="fileNameField" aria-labelledby="fileNameLabel">-</p>
+          </div>
+          <div class="row">
+            <span
+              id="fileSizeLabel"
+              data-l10n-id="document_properties_file_size"
+              >File size:</span
+            >
+            <p id="fileSizeField" aria-labelledby="fileSizeLabel">-</p>
+          </div>
+          <div class="separator"></div>
+          <div class="row">
+            <span id="titleLabel" data-l10n-id="document_properties_title"
+              >Title:</span
+            >
+            <p id="titleField" aria-labelledby="titleLabel">-</p>
+          </div>
+          <div class="row">
+            <span id="authorLabel" data-l10n-id="document_properties_author"
+              >Author:</span
+            >
+            <p id="authorField" aria-labelledby="authorLabel">-</p>
+          </div>
+          <div class="row">
+            <span id="subjectLabel" data-l10n-id="document_properties_subject"
+              >Subject:</span
+            >
+            <p id="subjectField" aria-labelledby="subjectLabel">-</p>
+          </div>
+          <div class="row">
+            <span id="keywordsLabel" data-l10n-id="document_properties_keywords"
+              >Keywords:</span
+            >
+            <p id="keywordsField" aria-labelledby="keywordsLabel">-</p>
+          </div>
+          <div class="row">
+            <span
+              id="creationDateLabel"
+              data-l10n-id="document_properties_creation_date"
+              >Creation Date:</span
+            >
+            <p id="creationDateField" aria-labelledby="creationDateLabel">-</p>
+          </div>
+          <div class="row">
+            <span
+              id="modificationDateLabel"
+              data-l10n-id="document_properties_modification_date"
+              >Modification Date:</span
+            >
+            <p
+              id="modificationDateField"
+              aria-labelledby="modificationDateLabel"
+            >
+              -
+            </p>
+          </div>
+          <div class="row">
+            <span id="creatorLabel" data-l10n-id="document_properties_creator"
+              >Creator:</span
+            >
+            <p id="creatorField" aria-labelledby="creatorLabel">-</p>
+          </div>
+          <div class="separator"></div>
+          <div class="row">
+            <span id="producerLabel" data-l10n-id="document_properties_producer"
+              >PDF Producer:</span
+            >
+            <p id="producerField" aria-labelledby="producerLabel">-</p>
+          </div>
+          <div class="row">
+            <span id="versionLabel" data-l10n-id="document_properties_version"
+              >PDF Version:</span
+            >
+            <p id="versionField" aria-labelledby="versionLabel">-</p>
+          </div>
+          <div class="row">
+            <span
+              id="pageCountLabel"
+              data-l10n-id="document_properties_page_count"
+              >Page Count:</span
+            >
+            <p id="pageCountField" aria-labelledby="pageCountLabel">-</p>
+          </div>
+          <div class="row">
+            <span
+              id="pageSizeLabel"
+              data-l10n-id="document_properties_page_size"
+              >Page Size:</span
+            >
+            <p id="pageSizeField" aria-labelledby="pageSizeLabel">-</p>
+          </div>
+          <div class="separator"></div>
+          <div class="row">
+            <span
+              id="linearizedLabel"
+              data-l10n-id="document_properties_linearized"
+              >Fast Web View:</span
+            >
+            <p id="linearizedField" aria-labelledby="linearizedLabel">-</p>
+          </div>
+          <div class="buttonRow">
+            <button id="documentPropertiesClose" class="dialogButton">
+              <span data-l10n-id="document_properties_close">Close</span>
+            </button>
+          </div>
         </dialog>
-        <dialog id="printServiceDialog" style="min-width: 200px;">
-            <div class="row">
-                <span data-l10n-id="print_progress_message">Preparing document for printing…</span>
-            </div>
-            <div class="row">
-                <progress value="0" max="100"></progress>
-                <span data-l10n-id="print_progress_percent" data-l10n-args='{ "progress": 0 }'
-                      class="relative-progress">0%</span>
-            </div>
-            <div class="buttonRow">
-                <button id="printCancel" class="dialogButton"><span data-l10n-id="print_progress_close">Cancel</span>
-                </button>
-            </div>
+        <dialog id="printServiceDialog" style="min-width: 200px">
+          <div class="row">
+            <span data-l10n-id="print_progress_message"
+              >Preparing document for printing…</span
+            >
+          </div>
+          <div class="row">
+            <progress value="0" max="100"></progress>
+            <span
+              data-l10n-id="print_progress_percent"
+              data-l10n-args='{ "progress": 0 }'
+              class="relative-progress"
+              >0%</span
+            >
+          </div>
+          <div class="buttonRow">
+            <button id="printCancel" class="dialogButton">
+              <span data-l10n-id="print_progress_close">Cancel</span>
+            </button>
+          </div>
         </dialog>
-    </div> <!-- dialogContainer -->
-
-</div> <!-- outerContainer -->
-<div id="printContainer"></div>
-
-<input type="file" id="fileInput" class="hidden">
-</body>
+      </div>
+      <!-- dialogContainer -->
+    </div>
+    <!-- outerContainer -->
+    <div id="printContainer"></div>
 
-</html>
+    <input type="file" id="fileInput" class="hidden" />
+  </body>
+</html>

+ 11 - 1
src/App.vue

@@ -6,6 +6,7 @@
     <Abandon v-model="abandon.show" />
     <isLogin v-model="is_login.show" />
     <ConfirmPopup />
+    <ToTop />
   </div>
 </template>
 
@@ -16,11 +17,20 @@ import Content from "@/components/layout/Content.vue";
 import Abandon from "@/components/module/abandon.vue";
 import IsLogin from "@/components/module/is-login.vue";
 import ConfirmPopup from "@/components/module/confirm-popup.vue";
+import ToTop from "@/components/module/to-top.vue";
 import { mapState } from "vuex";
 
 export default {
   name: "app",
-  components: { Header, Navbar, Content, Abandon, IsLogin, ConfirmPopup },
+  components: {
+    Header,
+    Navbar,
+    Content,
+    Abandon,
+    IsLogin,
+    ConfirmPopup,
+    ToTop,
+  },
   data() {
     return {
       isLogin: true,

BIN
src/assets/icon/下载_白色.png


BIN
src/assets/icon/下载_蓝色.png


BIN
src/assets/icon/回到顶部.png


+ 4 - 0
src/common/service.js

@@ -115,6 +115,10 @@ export const LevelOrderService = {
   payOrder: (data) => request.post("/api/Level_order/payOrder", data),
   // 创建订单---直付
   payOrderNew: (data) => request.post("/api/Level_order/payOrderNew", data),
+  // 申请开票
+  applyBill: (data) => request.post("/api/Level_order/applyBill", data),
+  // 获取发票详情
+  getBillInfo: (data) => request.get("/api/Level_order/getBillInfo", data),
 };
 
 // UserCenter 会员个人中心

+ 1 - 1
src/components/card/card-module/card-file-detail.vue

@@ -76,7 +76,7 @@ export default {
     }
     .type {
       height: 18px;
-      width: 36px;
+      padding: 0 5px;
       font-size: 12px;
       font-weight: 400;
       color: #ffffff;

+ 1 - 4
src/components/card/image-text/my-release-card.vue

@@ -24,7 +24,7 @@
         </div>
         <div class="mark">图文</div>
       </div>
-      <div class="right" v-if="is_normal">
+      <div class="right">
         <div class="title">{{ info.title }}</div>
         <div class="label" v-if="!!info.label">
           <div class="label-item" v-for="item in info.label.split(',')">
@@ -37,9 +37,6 @@
           <div class="time">{{ info.create_at }}</div>
         </div>
       </div>
-      <div class="right" v-else>
-        <div class="is_normal">已失效</div>
-      </div>
     </CardBox>
   </div>
 </template>

+ 1 - 4
src/components/card/information/my-release-card.vue

@@ -23,7 +23,7 @@
           }}
         </div>
       </div>
-      <div class="right" v-if="is_normal">
+      <div class="right">
         <div class="title">{{ info.title }}</div>
         <div class="label" v-if="!!info.label">
           <div class="label-item" v-for="item in info.label.split(',')">
@@ -36,9 +36,6 @@
           <div class="time">{{ info.create_at }}</div>
         </div>
       </div>
-      <div class="right" v-else>
-        <div class="is_normal">已失效</div>
-      </div>
     </CardBox>
   </div>
 </template>

+ 1 - 4
src/components/card/video/my-release-card.vue

@@ -23,7 +23,7 @@
           }}
         </div>
       </div>
-      <div class="right" v-if="is_normal">
+      <div class="right">
         <div class="title">{{ info.title }}</div>
         <div class="label" v-if="!!info.label">
           <div class="label-item" v-for="item in info.label.split(',')">
@@ -36,9 +36,6 @@
           <div class="time">{{ info.create_at }}</div>
         </div>
       </div>
-      <div class="right" v-else>
-        <div class="is_normal">已失效</div>
-      </div>
     </CardBox>
   </div>
 </template>

+ 2 - 2
src/components/layout/Header.vue

@@ -23,7 +23,7 @@
           size="small"
           type="primary"
           icon="el-icon-s-promotion"
-          style="background-color: #0054f7"
+          style="background-color: #0054f7; width: 80px; height: 35px"
           v-if="handleFilter()"
           @click="handleContribute"
         >
@@ -187,7 +187,7 @@ export default {
       display: flex;
       align-items: center;
       user-select: none;
-      img{
+      img {
         width: 18px;
         height: 18px;
       }

+ 7 - 5
src/components/layout/Navbar.vue

@@ -4,7 +4,7 @@
       class="navbar-item"
       :class="{ 'navbar-item-currnet': current == index }"
       v-for="(item, index) in menuList"
-      v-if="isChild ? true : !item.childShow"
+      v-if="isCenter ? true : !item.centerShow"
       @click="handlePush(item, index)"
     >
       <img :src="current == index ? item.icon_s : item.icon" alt="" />
@@ -25,7 +25,7 @@ export default {
           title: "会员中心",
           icon: "huiyuanzhongxin",
           link: "/vip",
-          childShow: true,
+          centerShow: true,
         },
         {
           title: "问答",
@@ -86,8 +86,10 @@ export default {
         })
       );
     },
-    isChild() {
-      return this.routePath.split("/").length > 2;
+    isCenter() {
+      return (
+        this.routePath.split("/").length > 2 || this.routePath.includes("vip")
+      );
     },
   },
   watch: {
@@ -106,7 +108,7 @@ export default {
       if (item.link == this.routePath) return;
       if (!item.link) return this.$message.info("敬请期待");
       this.current = index;
-      if (this.isChild) {
+      if (this.isCenter) {
         let url = item.children ? item.link + item.children : item.link;
         this.$router.push(url);
       } else {

+ 19 - 4
src/components/module/comment.vue

@@ -52,6 +52,7 @@
         <CommentDetailCard
           :comment="item"
           :option="option"
+          :reportType="option.reportType"
           @jump="handleJump"
           @reply="handleReply"
           @delete="handleDelete"
@@ -103,6 +104,8 @@ export default {
         postReplyApi: (_) => {},
         // 删除api
         delApi: (_) => {},
+        // 举报类型
+        reportType: 0,
       },
 
       // 数据列表
@@ -156,9 +159,15 @@ export default {
           this.$message.success(msg);
           this.content = "";
           this.send = false;
+          let comment_detail = {
+            is_like: 0,
+            like_num: 0,
+            can_delete: 1,
+            ...data.detail,
+          };
           this.params.sort_type == 1
-            ? this.list.unshift({ is_like: 0, like_num: 0, ...data.detail })
-            : this.list.push({ is_like: 0, like_num: 0, ...data.detail });
+            ? this.list.unshift(comment_detail)
+            : this.list.push();
         });
     },
     // 跳转
@@ -172,9 +181,15 @@ export default {
     },
     // 回复
     handleReply(item) {
+      let comment_detail = {
+        is_like: 0,
+        like_num: 0,
+        can_delete: 1,
+        ...item,
+      };
       this.params.sort_type == 1
-        ? this.list.unshift({ is_like: 0, like_num: 0, ...item })
-        : this.list.push({ is_like: 0, like_num: 0, ...item });
+        ? this.list.unshift(comment_detail)
+        : this.list.push(comment_detail);
     },
     // 删除
     handleDelete(item) {

+ 6 - 5
src/components/module/contribute/contribute-tab.vue

@@ -4,7 +4,11 @@
       class="tab-item"
       v-for="(item, index) in tabList"
       :class="{ select: index == current }"
-      @click="$emit('changeTab', index)"
+      @click="
+        (_) => {
+          !index ? $emit('changeTab', index) : $message.info('敬请期待');
+        }
+      "
     >
       {{ item.name }}
     </div>
@@ -22,10 +26,7 @@ export default {
   },
   data() {
     return {
-      tabList: [
-        { name: "无偿投稿" }, 
-        // { name: "有偿投稿" }
-      ],
+      tabList: [{ name: "无偿投稿" }, { name: "有偿投稿" }],
     };
   },
 };

+ 289 - 0
src/components/module/invoice-header-select.vue

@@ -0,0 +1,289 @@
+<template>
+  <div class="invoice-header-select">
+    <el-dialog
+      v-if="list_visible"
+      center
+      width="800px"
+      :visible.sync="list_visible"
+      :before-close="(_) => $emit('list_visible', false)"
+    >
+      <div class="content">
+        <div class="content-header">抬头选择</div>
+        <div class="content-center">
+          <div class="list">
+            <div
+              class="list-item"
+              :class="{ select: item.id == current.id }"
+              v-for="item in invoice_header_list"
+              @click="current = item"
+            >
+              <div class="left">
+                <div class="top">{{ item.header }}</div>
+                <div class="bottom">{{ item.identify_number }}</div>
+              </div>
+              <div class="right" @click.stop="openEdit('edit', item)">编辑</div>
+            </div>
+            <el-empty
+              v-if="!invoice_header_list.length"
+              description="没有更多数据"
+            ></el-empty>
+          </div>
+        </div>
+        <div class="content-footer">
+          <div class="btn cancel" @click="openEdit('add')">
+            新增 <i class="el-icon-plus"></i>
+          </div>
+          <div class="btn confirm" @click="handleSelect">确定</div>
+        </div>
+      </div>
+    </el-dialog>
+    <el-dialog
+      v-if="edit_visible"
+      center
+      append-body
+      width="800px"
+      :visible.sync="edit_visible"
+    >
+      <div class="content">
+        <div class="content-header">{{ edit_type }}抬头</div>
+        <div class="content-center">
+          <div class="form">
+            <div class="form-label">发票抬头</div>
+            <input
+              class="form-input"
+              type="text"
+              placeholder="请填写发票抬头"
+              v-model="header_params.header"
+            />
+            <div class="form-label">单位税号</div>
+            <input
+              class="form-input"
+              type="text"
+              placeholder="请填写单位税号"
+              v-model="header_params.identify_number"
+            />
+          </div>
+        </div>
+        <div class="content-footer">
+          <div class="btn cancel" @click="edit_visible = false">取消</div>
+          <div class="btn confirm" @click="selInvoiceHeader">确定</div>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { BillService } from "@/common/service";
+export default {
+  name: "InvoiceHeaderSelect",
+  props: {
+    list_visible: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  model: {
+    prop: "list_visible",
+    event: "list_visible",
+  },
+  data() {
+    return {
+      params: { page: 1, page_num: 20 },
+      edit_visible: false,
+      invoice_header_list: [],
+      edit_type: "新增",
+      header_params: {
+        header: "",
+        identify_number: "",
+      },
+      current: "",
+    };
+  },
+  mounted() {
+    this.getInvoiceHeaderList();
+  },
+  methods: {
+    // 获取抬头列表
+    getInvoiceHeaderList() {
+      BillService.getHeaderList(this.params).then(({ data }) => {
+        this.invoice_header_list = data.list;
+      });
+    },
+    // 打开编辑弹窗
+    openEdit(type, item) {
+      if (type == "add") {
+        this.edit_type = "新增";
+        this.header_params = {
+          header: "",
+          identify_number: "",
+        };
+      } else {
+        this.edit_type = "编辑";
+        this.header_params = item;
+      }
+      this.edit_visible = true;
+    },
+    // 校验
+    checkForm() {
+      if (!this.header_params.header) {
+        this.$message.error("请填写发票抬头");
+        return false;
+      }
+      if (!this.header_params.identify_number) {
+        this.$message.error("请填写单位税号");
+        return false;
+      }
+      return true;
+    },
+    // 添加/修改抬头
+    selInvoiceHeader() {
+      if (!this.checkForm()) return;
+      BillService.selBillHeader(this.header_params).then(() => {
+        this.$message.success(this.edit_type + "成功");
+        this.edit_visible = false;
+        this.getInvoiceHeaderList();
+      });
+    },
+    // 选中抬头
+    handleSelect() {
+      if (!this.current) return this.$message.error("请选中抬头");
+      this.$emit("handleSelect", this.current);
+      this.$emit("list_visible", false);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.invoice-header-select {
+  ::v-deep .el-dialog__body {
+    padding-top: 10px;
+  }
+  .content {
+    width: 100%;
+    .content-header {
+      width: 100%;
+      text-align: center;
+      font-size: 20px;
+      font-weight: 500;
+      color: #000000;
+    }
+    .content-center {
+      width: 100%;
+      height: 350px;
+      margin: 20px 0;
+      .list {
+        width: 100%;
+        height: 90%;
+        margin-top: 5%;
+        background: #f5f5f5;
+        border-radius: 10px;
+        overflow-y: auto;
+        .list-item {
+          width: 660px;
+          height: 80px;
+          padding: 0 20px;
+          background: #ffffff;
+          border-radius: 10px;
+          border: 3px solid transparent;
+          margin: 20px auto 0;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          .left {
+            height: 55px;
+            display: flex;
+            flex-direction: column;
+            justify-content: space-between;
+            .top {
+              font-size: 20px;
+              font-weight: 400;
+              color: #000000;
+            }
+            .bottom {
+              font-size: 14px;
+              font-weight: 400;
+              color: #999999;
+            }
+          }
+          .right {
+            width: 70px;
+            height: 45px;
+            background: #0054f7;
+            border-radius: 10px;
+            text-align: center;
+            line-height: 45px;
+            font-size: 14px;
+            font-weight: 400;
+            color: #ffffff;
+            cursor: pointer;
+          }
+        }
+        > :last-child {
+          margin-bottom: 20px;
+        }
+        .select {
+          border: 3px solid #0054f7;
+        }
+      }
+      .form {
+        width: 400px;
+        height: 100%;
+        margin: 0 auto;
+        display: flex;
+        justify-content: center;
+        flex-direction: column;
+        .form-label {
+          font-size: 16px;
+          font-weight: 500;
+          color: #141414;
+          margin-bottom: 20px;
+        }
+        .form-input {
+          width: 100%;
+          height: 45px;
+          border: 1px solid rgba(151, 151, 151, 0.5);
+          box-sizing: border-box;
+          outline: none;
+          font-size: 16px;
+          font-weight: 400;
+          color: #333333;
+          margin-bottom: 20px;
+          padding: 15px;
+          box-sizing: border-box;
+        }
+        .form-input::placeholder {
+          color: rgba(151, 151, 151, 0.5);
+        }
+      }
+    }
+    .content-footer {
+      width: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .btn {
+        width: 200px;
+        height: 60px;
+        text-align: center;
+        line-height: 60px;
+        font-size: 22px;
+        font-weight: 400;
+        box-sizing: border-box;
+        border-radius: 10px;
+        cursor: pointer;
+      }
+      .cancel {
+        border: 1px solid #0054f7;
+        color: #0054f7;
+      }
+      .confirm {
+        background: #0054f7;
+        color: #ffffff;
+        margin-left: 20px;
+      }
+    }
+  }
+}
+</style>

+ 11 - 1
src/components/module/invoice.vue

@@ -31,7 +31,7 @@
             </div>
           </div>
           <div class="get-header">
-            <span>获取搞一下汽车电子发票抬头</span>
+            <span @click="visible = true">获取搞一下汽车电子发票抬头</span>
           </div>
         </div>
       </div>
@@ -70,12 +70,16 @@
         </div>
       </div>
     </div>
+    <InvoiceHeaderSelect v-model="visible" @handleSelect="handleSelect" />
   </div>
 </template>
 
 <script>
 import { BillService } from "@/common/service";
+import InvoiceHeaderSelect from "@/components/module/invoice-header-select.vue";
 export default {
+  components: { InvoiceHeaderSelect },
+  name:"Invoice",
   props: {
     params: {
       type: Object,
@@ -88,6 +92,7 @@ export default {
     return {
       invoice_switch: true,
       invoice_list: [],
+      visible: false,
     };
   },
   mounted() {
@@ -101,6 +106,11 @@ export default {
         this.params.type = data.list ? data.list[0].id : "";
       });
     },
+    // 设置发票抬头
+    handleSelect(item) {
+      this.params.header = item.header;
+      this.params.identify_number = item.identify_number;
+    },
   },
 };
 </script>

+ 17 - 2
src/components/module/report.vue

@@ -88,12 +88,27 @@ export default {
         return this.$message.error("请选择举报类目");
       if (this.reportIds.includes("other") && !this.reportContent)
         return this.$message.error("请填写举报内容");
+      let report_id = 0;
+      switch (this.type) {
+        case 1:
+          report_id = this.info.video_id;
+          break;
+        case 4:
+          report_id = this.info.datum_id;
+          break;
+        case 5:
+          report_id = this.info.article_id;
+          break;
+        default:
+          report_id = this.info.id;
+      }
       let params = {
+        report_id,
         type: this.type,
-        report_id: this.info.id,
         case_ids: this.reportIds.filter((item) => item != "other").join(","),
         content: this.reportIds.includes("other") ? this.reportContent : "",
       };
+      console.log(params,'111111');
       ReportService.userReport(params).then(({ msg, data }) => {
         this.$message.success(msg);
         this.$emit("visible", false);
@@ -104,7 +119,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-::v-deep .el-dialog{
+::v-deep .el-dialog {
   z-index: 9999;
 }
 ::v-deep .el-dialog__header .el-dialog__title {

+ 50 - 0
src/components/module/to-top.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="to-top" :style="{ opacity: show ? 1 : 0 }" @click="toTop">
+    <img src="@/assets/icon/回到顶部.png" alt="" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: "ToTop",
+  data() {
+    return {
+      show: false,
+    };
+  },
+  mounted() {
+    window.addEventListener("scroll", this.showBtn, true);
+  },
+  methods: {
+    showBtn() {
+      // 获取滚动元素的滚动距离
+      let { innerHeight, scrollY } = window;
+      this.show = scrollY + 100 > innerHeight;
+    },
+    toTop() {
+      let roll = setInterval((_) => {
+        let { scrollY } = window;
+        if (scrollY > 100) {
+          scrollY = scrollY - 100;
+          window.scrollTo(0, scrollY);
+        } else {
+          window.scrollTo(0, 0);
+          clearInterval(roll);
+        }
+      }, 10);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.to-top {
+  position: fixed;
+  bottom: 100px;
+  right: 20px;
+  img {
+    width: 60px;
+    height: 60px;
+  }
+}
+</style>

+ 1 - 1
src/components/video/video-all-card.vue

@@ -5,7 +5,7 @@
     </div>
     <div class="info">
       <div class="title">{{ info.title }}</div>
-      <div class="num">共{{ info.url_num }}集</div>
+      <div class="num">共{{ info.total_sequel }}集</div>
     </div>
   </div>
 </template>

+ 6 - 4
src/components/vip/order-card.vue

@@ -15,7 +15,11 @@
     <div class="card-footer">
       <div class="btn" @click="toInvoice">
         {{
-          info.bill_info ? "查看发票" : info.bill_apply ? "开票中" : "申请开票"
+          info.bill_info
+            ? info.bill_info.bill_img
+              ? "查看发票"
+              : "开票中"
+            : "申请开票"
         }}
       </div>
       <div class="btn">联系客服</div>
@@ -35,9 +39,7 @@ export default {
     toInvoice() {
       this.$router.push({
         path: this.info.bill_info
-          ? ""
-          : this.info.bill_apply
-          ? ""
+          ? "/vip-invoice-detail"
           : "/vip-invoice-apply",
         query: {
           order_id: this.info.id,

+ 7 - 0
src/router/vip-routes.js

@@ -41,4 +41,11 @@ export const vipRoutes = [
     },
     component: () => import("@/views/vip/vip-invoice-apply.vue"),
   },
+  {
+    path: "/vip-invoice-detail",
+    meta: {
+      title: "发票详情", // 页面标题title
+    },
+    component: () => import("@/views/vip/vip-invoice-detail.vue"),
+  },
 ];

+ 10 - 1
src/views/image-text/children/comment-on-my.vue

@@ -3,7 +3,16 @@
     <div class="wrap-title">
       <TitleControl title="评论我的" @handleChange="handleSearch">
         <div slot="control" class="control-btn">
-          <div class="is-read" v-if="!manageType" @click="handleRead(list, 1)">
+          <div
+            class="is-read"
+            v-if="!manageType"
+            @click="
+              (_) => {
+                $message.success('已将所有信息标为已读');
+                handleRead(list, 1);
+              }
+            "
+          >
             <img src="@/assets/icon/read.png" alt="" />
             <span>全部已读</span>
           </div>

+ 1 - 1
src/views/image-text/children/my-collect.vue

@@ -211,7 +211,7 @@ export default {
     handleForward(item) {
       ArticleService.articleTransmit({
         item_id: item.id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then((_) => (item.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

+ 1 - 1
src/views/image-text/children/my-like.vue

@@ -281,7 +281,7 @@ export default {
     handleForward(item) {
       ArticleService.articleTransmit({
         item_id: item.id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then((_) => (item.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

+ 10 - 1
src/views/image-text/children/reply-on-my.vue

@@ -3,7 +3,16 @@
     <div class="wrap-title">
       <TitleControl title="回复我的" @handleChange="handleSearch">
         <div slot="control" class="control-btn">
-          <div class="is-read" v-if="!manageType" @click="handleRead(list, 1)">
+          <div
+            class="is-read"
+            v-if="!manageType"
+            @click="
+              (_) => {
+                $message.success('已将所有信息标为已读');
+                handleRead(list, 1);
+              }
+            "
+          >
             <img src="@/assets/icon/read.png" alt="" />
             <span>全部已读</span>
           </div>

+ 1 - 1
src/views/image-text/image-text-detail.vue

@@ -214,7 +214,7 @@ export default {
     // 分享---统计分享量
     handleForward() {
       ArticleService.articleTransmit({ item_id: this.info.id }).then(
-        (_) => (this.info.transmit_num += 1)
+        (_) => (this.info.transmit_num = Number(this.info.transmit_num) + 1)
       );
     },
     // 举报

+ 0 - 5
src/views/image-text/index.vue

@@ -66,11 +66,6 @@ export default {
       ],
     };
   },
-  mounted() {
-    if (this.$store.state.userInfo)
-      this.$store.dispatch("getMarkNum", "imageText");
-  },
-  methods: {},
 };
 </script>
 

+ 10 - 1
src/views/information/children/comment-on-my.vue

@@ -3,7 +3,16 @@
     <div class="wrap-title">
       <TitleControl title="评论我的" @handleChange="handleSearch">
         <div slot="control" class="control-btn">
-          <div class="is-read" v-if="!manageType" @click="handleRead(list, 1)">
+          <div
+            class="is-read"
+            v-if="!manageType"
+            @click="
+              (_) => {
+                $message.success('已将所有信息标为已读');
+                handleRead(list, 1);
+              }
+            "
+          >
             <img src="@/assets/icon/read.png" alt="" />
             <span>全部已读</span>
           </div>

+ 1 - 1
src/views/information/children/my-collect.vue

@@ -211,7 +211,7 @@ export default {
       DatumService.articleTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then((_) => (item.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

+ 3 - 1
src/views/information/children/my-like.vue

@@ -281,7 +281,9 @@ export default {
       DatumService.articleTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then(
+        (_) => (this.info.transmit_num = Number(this.info.transmit_num) + 1)
+      );
     },
     // 评论
     handleComment(item) {

+ 17 - 10
src/views/information/children/reply-on-my.vue

@@ -3,7 +3,16 @@
     <div class="wrap-title">
       <TitleControl title="回复我的" @handleChange="handleSearch">
         <div slot="control" class="control-btn">
-          <div class="is-read" v-if="!manageType" @click="handleRead(list, 1)">
+          <div
+            class="is-read"
+            v-if="!manageType"
+            @click="
+              (_) => {
+                $message.success('已将所有信息标为已读');
+                handleRead(list, 1);
+              }
+            "
+          >
             <img src="@/assets/icon/read.png" alt="" />
             <span>全部已读</span>
           </div>
@@ -148,15 +157,13 @@ export default {
       let that = this;
       this.showConfirmPopup("确定要删除该信息?")
         .then(() => {
-          DatumService.batchesDel({ id: val.id, type: 10 }).then(
-            ({ data }) => {
-              that.list.splice(
-                that.list.findIndex((item) => item.id == val.id),
-                1
-              );
-              this.$message.success("删除成功!");
-            }
-          );
+          DatumService.batchesDel({ id: val.id, type: 10 }).then(({ data }) => {
+            that.list.splice(
+              that.list.findIndex((item) => item.id == val.id),
+              1
+            );
+            this.$message.success("删除成功!");
+          });
         })
         .catch((_) => {});
     },

+ 0 - 5
src/views/information/index.vue

@@ -62,11 +62,6 @@ export default {
       ],
     };
   },
-  mounted() {
-    if (this.$store.state.userInfo)
-      this.$store.dispatch("getMarkNum", "information");
-  },
-  methods: {},
 };
 </script>
 

+ 7 - 3
src/views/information/information-collection.vue

@@ -62,13 +62,17 @@
     >
       <div
         class="item"
-        v-if="info.goods_id"
+        v-if="!manageType && info.goods_id"
         @click="$message.success('敬请期待')"
       >
         <img src="@/assets/icon/产品_蓝色.png" alt="" />
         <span>相关产品</span>
       </div>
-      <div class="item" v-if="info.video_id" @click="toVideoDetail">
+      <div
+        class="item"
+        v-if="!manageType && info.video_id"
+        @click="toVideoDetail"
+      >
         <img src="@/assets/icon/视频.png" alt="" />
         <span>相关视频</span>
       </div>
@@ -77,7 +81,7 @@
         v-if="manageType && download_list.length"
         @click="handleClick"
       >
-        <img src="@/assets/icon/视频.png" alt="" />
+        <img src="@/assets/icon/下载_白色.png" alt="" />
         <span>下载</span>
       </div>
     </div>

+ 3 - 1
src/views/information/information-detail.vue

@@ -234,7 +234,9 @@ export default {
       DatumService.datumTransmit({
         datum_id: this.datum_info.id,
         url_id: this.info.id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then(
+        (_) => (this.info.transmit_num = Number(this.info.transmit_num) + 1)
+      );
     },
     // 举报
     handleReport() {

+ 10 - 1
src/views/video/children/comment-on-my.vue

@@ -3,7 +3,16 @@
     <div class="wrap-title">
       <TitleControl title="评论我的" @handleChange="handleSearch">
         <div slot="control" class="control-btn">
-          <div class="is-read" v-if="!manageType" @click="handleRead(list, 1)">
+          <div
+            class="is-read"
+            v-if="!manageType"
+            @click="
+              (_) => {
+                $message.success('已将所有信息标为已读');
+                handleRead(list, 1);
+              }
+            "
+          >
             <img src="@/assets/icon/read.png" alt="" />
             <span>全部已读</span>
           </div>

+ 2 - 1
src/views/video/children/my-collect.vue

@@ -136,6 +136,7 @@ export default {
             ...params,
             id: comment.id,
           }),
+        reportType: 2,
         // 删除评论
         delApi: (params) => VideoService.delComment({ id: params.id }),
       };
@@ -216,7 +217,7 @@ export default {
       VideoService.videoTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then((_) => (item.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

+ 2 - 1
src/views/video/children/my-like.vue

@@ -184,6 +184,7 @@ export default {
             ...params,
             id: comment.id,
           }),
+        reportType: 2,
         // 删除评论
         delApi: (params) => VideoService.delComment({ id: params.id }),
       };
@@ -286,7 +287,7 @@ export default {
       VideoService.videoTransmit({
         video_id: item.video_id,
         url_id: item.url_id,
-      }).then((_) => (this.info.transmit_num += 1));
+      }).then((_) => (item.transmit_num += 1));
     },
     // 评论
     handleComment(item) {

+ 10 - 1
src/views/video/children/reply-on-my.vue

@@ -3,7 +3,16 @@
     <div class="wrap-title">
       <TitleControl title="回复我的" @handleChange="handleSearch">
         <div slot="control" class="control-btn">
-          <div class="is-read" v-if="!manageType" @click="handleRead(list, 1)">
+          <div
+            class="is-read"
+            v-if="!manageType"
+            @click="
+              (_) => {
+                $message.success('已将所有信息标为已读');
+                handleRead(list, 1);
+              }
+            "
+          >
             <img src="@/assets/icon/read.png" alt="" />
             <span>全部已读</span>
           </div>

+ 1 - 0
src/views/video/components/child-content.vue

@@ -31,6 +31,7 @@ export default {
   },
   mounted() {
     this.$store.dispatch("getMarkNum", "video");
+    console.log('11111111');
   },
   methods: {},
 };

+ 1 - 1
src/views/video/components/content.vue

@@ -102,7 +102,7 @@ export default {
       this.listParams.page = 1;
       this.recommendList = [];
       this.allList = [];
-      i == 0 ? this.getRecommendList() : this.getVideoList();
+      i == 0 ? this.getRecommendList() : "";
     },
     // 刷新
     handleRefresh() {

+ 0 - 4
src/views/video/index.vue

@@ -66,10 +66,6 @@ export default {
       ],
     };
   },
-  mounted() {
-    if (this.$store.state.userInfo) this.$store.dispatch("getMarkNum", "video");
-  },
-  methods: {},
 };
 </script>
 

+ 1 - 0
src/views/video/video-detail.vue

@@ -90,6 +90,7 @@ export default {
             ...params,
             id: comment.id,
           }),
+        reportType: 2,
         // 删除评论
         delApi: (params) => VideoService.delComment({ id: params.id }),
       };

+ 7 - 2
src/views/vip/vip-invoice-apply.vue

@@ -65,7 +65,6 @@ export default {
         }
       );
     },
-
     // 校验
     checkForm() {
       if (!this.params.header) {
@@ -80,11 +79,17 @@ export default {
         this.$message.error("请填写邮箱");
         return false;
       }
+      return true;
     },
     // 提交
     submit() {
       if (!this.checkForm()) return;
-      
+      LevelOrderService.applyBill(this.params).then(({ msg }) => {
+        this.$message.success(msg);
+        setTimeout((_) => {
+          this.$router.back();
+        }, 1500);
+      });
     },
   },
 };

+ 187 - 0
src/views/vip/vip-invoice-detail.vue

@@ -0,0 +1,187 @@
+<template>
+  <div class="wrap">
+    <div class="wrap-content">
+      <div class="back" @click="$router.back()">
+        <img src="@/assets/icon/back.png" /><span>返回</span>
+      </div>
+      <div class="detail">
+        <div class="header">
+          <div class="title">发票详情</div>
+          <div class="download" v-if="info.bill_img" @click="downloadFill">
+            <img src="@/assets/icon/下载_蓝色.png" />
+            <span>下载</span>
+          </div>
+        </div>
+        <div class="content">
+          <div class="item">
+            <div class="label">发票状态</div>
+            <div class="value" :class="{ green: !!info.bill_img }">
+              {{
+                info.bill_img == undefined
+                  ? "-"
+                  : info.bill_img
+                  ? "已开票"
+                  : "开票中"
+              }}
+            </div>
+          </div>
+          <div class="item">
+            <div class="label">发票类型</div>
+            <div class="value">{{ info.type_title || "-" }}</div>
+          </div>
+          <div class="item">
+            <div class="label">发票抬头</div>
+            <div class="value">{{ info.header || "-" }}</div>
+          </div>
+          <div class="item">
+            <div class="label">纳税人识别号</div>
+            <div class="value">{{ info.identify_number || "-" }}</div>
+          </div>
+          <div class="item">
+            <div class="label">发票金额</div>
+            <div class="value">{{ info.money || "-" }}</div>
+          </div>
+          <div class="item">
+            <div class="label">申请时间</div>
+            <div class="value">{{ info.create_at || "-" }}</div>
+          </div>
+          <div class="item">
+            <div class="label">开票时间</div>
+            <div class="value">{{ info.bill_time || "-" }}</div>
+          </div>
+          <div class="item">
+            <div class="label">邮箱</div>
+            <div class="value">{{ info.email || "-" }}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { LevelOrderService } from "@/common/service";
+import { downloadLocalFile } from "@/common/request";
+export default {
+  data() {
+    return {
+      info: {},
+    };
+  },
+  mounted() {
+    const query = this.$route.query;
+    this.getInvoiceDetail(query.order_id);
+  },
+  methods: {
+    // 获取发票详情
+    getInvoiceDetail(id) {
+      LevelOrderService.getBillInfo({ id }).then(({ data }) => {
+        this.info = data.detail;
+      });
+    },
+    // 下载发票
+    downloadFill() {
+      downloadLocalFile(this.info.bill_img, this.info.header);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.wrap {
+  width: calc((100% - 240px));
+  .wrap-content {
+    width: 80%;
+    margin: 0 auto;
+    min-width: 900px;
+
+    .back {
+      width: 90px;
+      height: 40px;
+      line-height: 50px;
+      margin-top: 20px;
+      font-size: 16px;
+      font-weight: 400;
+      color: #222222;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background-color: white;
+      border-radius: 4px;
+      border-radius: 10px;
+      cursor: pointer;
+      img {
+        width: 10px;
+        height: 16px;
+        margin-right: 5px;
+      }
+    }
+    .detail {
+      width: 100%;
+      padding: 20px;
+      margin-top: 20px;
+      background: white;
+      box-sizing: border-box;
+      .header {
+        height: 42px;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        .title {
+          font-size: 24px;
+          font-weight: 500;
+          color: #222222;
+        }
+        .download {
+          width: 100px;
+          height: 40px;
+          border-radius: 3px;
+          border: 1px solid #2a63f3;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          cursor: pointer;
+          img {
+            width: 16px;
+            height: 16px;
+          }
+          span {
+            font-size: 14px;
+            font-weight: 400;
+            color: #2a63f3;
+            line-height: 14px;
+            margin-left: 2px;
+          }
+        }
+      }
+      .content {
+        margin-top: 10px;
+        padding: 30px;
+        .item {
+          display: flex;
+          align-items: center;
+          margin-bottom: 20px;
+          .label {
+            width: 150px;
+            height: 30px;
+            font-size: 15px;
+            font-weight: 400;
+            color: #222222;
+            line-height: 30px;
+          }
+          .value {
+            height: 30px;
+            font-size: 15px;
+            font-weight: 400;
+            color: rgba(34, 34, 34, 0.8);
+            line-height: 30px;
+          }
+          .green {
+            color: #34c759;
+          }
+        }
+      }
+    }
+  }
+}
+</style>