Forráskód Böngészése

10.20 bug等更新

zhuohongkui 1 éve
szülő
commit
075949d07f
69 módosított fájl, 958 hozzáadás és 626 törlés
  1. 5 0
      package-lock.json
  2. 1 0
      package.json
  3. BIN
      public/favicon-vue.ico
  4. BIN
      public/favicon.ico
  5. 82 0
      public/iframe/canvas-iframe.html
  6. 1 1
      public/index.html
  7. 20 11
      src/App.vue
  8. 72 62
      src/common/config.js
  9. 7 7
      src/components/card/card-module/card-footer.vue
  10. 115 0
      src/components/image-text/image-text-detail-content new.vue
  11. 6 2
      src/components/image-text/image-text-recommend-card.vue
  12. 2 2
      src/components/layout/Header.vue
  13. 2 1
      src/components/module/to-contact.vue
  14. 12 12
      src/components/module/to-top.vue
  15. 25 13
      src/components/video/video-interactive.vue
  16. 24 22
      src/components/video/video-player.vue
  17. 45 1
      src/components/video/video-sidebar.vue
  18. 4 0
      src/main.js
  19. 0 160
      src/router/activity-routes.js
  20. 3 3
      src/router/image-text-routes.js
  21. 14 6
      src/router/index.js
  22. 3 3
      src/router/information-routes.js
  23. 0 163
      src/router/supplier-routes.js
  24. 3 3
      src/router/video-routes.js
  25. 34 2
      src/store/modules/contact.js
  26. 3 3
      src/views/image-text/children/comment-on-my.vue
  27. 3 3
      src/views/image-text/children/like-on-my.vue
  28. 3 3
      src/views/image-text/children/my-chasingFun.vue
  29. 3 3
      src/views/image-text/children/my-collect.vue
  30. 3 3
      src/views/image-text/children/my-comment.vue
  31. 3 3
      src/views/image-text/children/my-like.vue
  32. 3 3
      src/views/image-text/children/my-release.vue
  33. 3 3
      src/views/image-text/children/my-reply.vue
  34. 3 3
      src/views/image-text/children/reply-on-my.vue
  35. 3 3
      src/views/image-text/children/study-history.vue
  36. 3 3
      src/views/image-text/components/content.vue
  37. 8 5
      src/views/image-text/image-text-collection.vue
  38. 11 12
      src/views/image-text/image-text-details.vue
  39. 7 7
      src/views/index.vue
  40. 3 3
      src/views/information/children/comment-on-my.vue
  41. 3 3
      src/views/information/children/like-on-my.vue
  42. 3 3
      src/views/information/children/my-chasingFun.vue
  43. 3 3
      src/views/information/children/my-collect.vue
  44. 3 3
      src/views/information/children/my-comment.vue
  45. 3 3
      src/views/information/children/my-like.vue
  46. 3 3
      src/views/information/children/my-release.vue
  47. 3 3
      src/views/information/children/my-reply.vue
  48. 3 3
      src/views/information/children/reply-on-my.vue
  49. 3 3
      src/views/information/children/study-history.vue
  50. 3 3
      src/views/information/components/content.vue
  51. 15 14
      src/views/information/information-collection.vue
  52. 8 8
      src/views/information/information-details.vue
  53. 30 0
      src/views/pdf/pdf-view-iframe.vue
  54. 197 0
      src/views/pdf/pdf-view.vue
  55. 1 1
      src/views/video/children/comment-on-my.vue
  56. 1 1
      src/views/video/children/like-on-my.vue
  57. 1 1
      src/views/video/children/my-buy.vue
  58. 1 1
      src/views/video/children/my-chasingFun.vue
  59. 1 1
      src/views/video/children/my-collect.vue
  60. 1 1
      src/views/video/children/my-comment.vue
  61. 1 1
      src/views/video/children/my-like.vue
  62. 1 1
      src/views/video/children/my-release.vue
  63. 1 1
      src/views/video/children/my-reply.vue
  64. 1 1
      src/views/video/children/reply-on-my.vue
  65. 1 1
      src/views/video/children/study-history.vue
  66. 1 1
      src/views/video/components/content.vue
  67. 17 13
      src/views/video/video-details.vue
  68. 106 9
      src/views/vip/children/account.vue
  69. 1 6
      src/views/vip/vip-member.vue

+ 5 - 0
package-lock.json

@@ -13682,6 +13682,11 @@
       "resolved": "https://registry.npmjs.org/vue-awesome-swiper/-/vue-awesome-swiper-4.1.1.tgz",
       "integrity": "sha512-50um10t6N+lJaORkpwSi1wWuMmBI1sgFc9Znsi5oUykw2cO5DzLaBHcO2JNX21R+Ue4TGoIJDhhxjBHtkFrTEQ=="
     },
+    "vue-cropper": {
+      "version": "0.6.4",
+      "resolved": "https://registry.npmjs.org/vue-cropper/-/vue-cropper-0.6.4.tgz",
+      "integrity": "sha512-U3bm17Li/Xwfw2t3pr8/hFE/tYhvwIWqepHK9IFC1TnX1KFd64VyfCD9nMBhPY91RyvMC6jSQgT/DyDNKuTpIQ=="
+    },
     "vue-hot-reload-api": {
       "version": "2.3.4",
       "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",

+ 1 - 0
package.json

@@ -27,6 +27,7 @@
     "swiper": "^5.4.5",
     "vue": "^2.6.10",
     "vue-awesome-swiper": "^4.1.1",
+    "vue-cropper": "^0.6.4",
     "vue-router": "^3.5.2",
     "vue-video-player": "^5.0.2",
     "vuex": "^3.6.2"

BIN
public/favicon-vue.ico


BIN
public/favicon.ico


+ 82 - 0
public/iframe/canvas-iframe.html

@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>iframe</title>
+    <style>
+      html,
+      body {
+        width: 100% !important;
+        overflow: hidden !important;
+      }
+      #wrap {
+        position: relative;
+      }
+    </style>
+  </head>
+  <body>
+    <div id="wrap"></div>
+    <script>
+      const wrap = document.querySelector("#wrap");
+      let cover_value = "",
+        loading = true;
+
+      // 设置元素监听器
+      let wrapOb = new MutationObserver((e) => {
+        if (!loading) return;
+        window.parent.postMessage(true);
+        wrap.appendChild(createWatermark(cover_value));
+        loading = false;
+      });
+      // 开始监听 wrap的子元素
+      wrapOb.observe(wrap, { childList: true });
+
+      window.addEventListener("message", (event) => {
+        const { content, cover } = event.data;
+        cover_value = cover;
+        wrap.innerHTML = content;
+      });
+      // 创建水印
+      function createWatermark(coverValue) {
+        const wrap = document.querySelector("#wrap"),
+          boxHeight = wrap.offsetHeight,
+          boxWidth = wrap.offsetWidth,
+          pageHeight = boxWidth / 0.7,
+          nums = Math.floor(boxHeight / pageHeight),
+          fontSize = parseInt(wrap.offsetWidth / 12),
+          cover = document.createElement("div");
+        cover.className = "cover";
+        cover.style.height = boxHeight + "px";
+        cover.style.lineHeight = fontSize + "px";
+        cover.style.position = "absolute";
+        cover.style.top = 0;
+        cover.style.left = "50%";
+        cover.style.display = "flex";
+        cover.style.flexDirection = "column";
+        cover.style.alignItems = "center";
+        cover.style.justifyContent = "center";
+        cover.style.transform = "translateX(-50%)";
+        cover.style.pointerEvents = "none"; // 取消所有事件
+        for (let i = 0; i < nums; i++) {
+          let c = document.createElement("div");
+          c.className = "cover";
+          c.style.width = "max-content";
+          c.style.height = boxHeight + "px";
+          c.style.fontSize = fontSize + "px";
+          c.style.transform = "rotateZ(315deg) scale(0.7)";
+          c.style.color = "rgba(0, 0, 0, 0.05)";
+          c.style.fontWeight = "bold";
+          c.style.display = "flex";
+          c.style.flexDirection = "column";
+          c.style.alignItems = "center";
+          c.style.justifyContent = "center";
+          c.innerText = coverValue;
+          c.style.pointerEvents = "none"; // 取消所有事件
+          cover.appendChild(c);
+        }
+        return cover;
+      }
+    </script>
+  </body>
+</html>

+ 1 - 1
public/index.html

@@ -13,7 +13,7 @@
     />
 
     <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
-    <title>default</title>
+    <title>搞一下汽车电子</title>
     <link
       rel="stylesheet"
       href="https://g.alicdn.com/de/prismplayer/2.11.0/skins/default/aliplayer-min.css"

+ 20 - 11
src/App.vue

@@ -61,27 +61,36 @@ export default {
     },
   },
   mounted() {
-    let btnRight = 100 + 8;
-    this.btnLeft =
-        window.innerWidth - btnRight > 1097
-          ? window.innerWidth - btnRight
-          : 1097;
+    this.setBtnPosition();
+    this.setBodyZoom();
     window.onresize = () => {
       this.$resizeListenerList.forEach((fn) => fn());
-      this.btnLeft =
-        window.innerWidth - btnRight > 1097
-          ? window.innerWidth - btnRight
-          : 1097;
-      // body.style.zoom
+      this.setBtnPosition();
+      this.setBodyZoom();
     };
   },
+  methods: {
+    setBodyZoom() {
+      const body = document.querySelector("body"),
+        max_width = window.screen.availWidth;
+      body.style.zoom = (max_width / 1920).toFixed("4");
+    },
+    setBtnPosition() {
+      let btnRight = 100 + 8;
+      // this.btnLeft =
+      //   window.innerWidth - btnRight > 1097
+      //     ? window.innerWidth - btnRight
+      //     : 1097;
+      this.btnLeft = window.innerWidth - btnRight;
+    },
+  },
 };
 </script>
 
 <style lang="scss">
 @import "~@/assets/css/common.scss";
 :root {
-  --scrollTop: 0px;    // 窗口当前滚动位置
+  --scrollTop: 0px; // 窗口当前滚动位置
   --windowHeight: 0px; // 窗口最大宽度
 }
 

+ 72 - 62
src/common/config.js

@@ -1,90 +1,100 @@
 // 接口请求地址
-export const BASE_URL = 'https://www.gyxqcdz.com';//正式
-// export const BASE_URL = 'https://ceshi.gyxqcdz.com';//测试
+// export const BASE_URL = 'https://www.gyxqcdz.com';//正式
+export const BASE_URL = "https://ceshi.gyxqcdz.com"; //测试
+// export const BASE_URL = '';//测试
 
 // 分享地址
-export const FORWARD_URL = 'https://www.gyxqcdz.com/pc/#';//正式
-// export const FORWARD_URL = 'https://ceshi.gyxqcdz.com/pc/#';//测试
+// export const FORWARD_URL = 'https://www.gyxqcdz.com/pc/#';//正式
+export const FORWARD_URL = "https://ceshi.gyxqcdz.com/pc/#"; //测试
 
 // 阿里云oss文件域名
-export const OSS_URL = 'https://gaoyixia.oss-cn-hangzhou.aliyuncs.com/';
+export const OSS_URL = "https://gaoyixia.oss-cn-hangzhou.aliyuncs.com/";
 
 // 微信appid
-export const WX_APP_ID = 'wx9c6bb6d105d7e75c';
+export const WX_APP_ID = "wx9c6bb6d105d7e75c";
 
 // 高德地图key
-export const AMAP_KEY = '5295cbb966c063bde1ed33c1de7ed6bd';
+export const AMAP_KEY = "5295cbb966c063bde1ed33c1de7ed6bd";
 
 // DRM加密证书
-export const DRM_CERT_ID = '4fb3aca2f14a4666945e0902a544d138';
+export const DRM_CERT_ID = "4fb3aca2f14a4666945e0902a544d138";
 
 // UrlScheme
-export const SCHEME_IOS = 'gotit2782015695';
-export const SCHEME_ANDRIOD = 'myinfo';
+export const SCHEME_IOS = "gotit2782015695";
+export const SCHEME_ANDRIOD = "myinfo";
 
 // 视频可上传的文件类型
-export const VIDEO_UPLOAD_FILE_TYPE = 'video/*';
+export const VIDEO_UPLOAD_FILE_TYPE = "video/*";
 
 // 图文可上传的文件类型
-export const IMAGE_TEXT_UPLOAD_FILE_TYPE = '.doc,.docx,.ppt,.pptx,.xls,.xlsx,.pdf,.zip';
+export const IMAGE_TEXT_UPLOAD_FILE_TYPE =
+  ".doc,.docx,.ppt,.pptx,.xls,.xlsx,.pdf,.zip";
 
 // 资料可上传的文件类型
-export const INFORMATION_UPLOAD_FILE_TYPE = '.doc,.docx,.ppt,.pptx,.xls,.xlsx,.pdf,.zip';
+export const INFORMATION_UPLOAD_FILE_TYPE =
+  ".doc,.docx,.ppt,.pptx,.xls,.xlsx,.pdf,.zip";
 
 // 资料可预览的文件类型
-export const INFORMATION_PREVIEWABLE_FILE_TYPE = ['doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx', 'pdf'];
+export const INFORMATION_PREVIEWABLE_FILE_TYPE = [
+  "doc",
+  "docx",
+  "ppt",
+  "pptx",
+  "xls",
+  "xlsx",
+  "pdf",
+];
 
 export const ICON = {
-    ['doc']: require('../assets/icon/information_file/doc.png'),
-    ['ppt']: require('../assets/icon/information_file/ppt.png'),
-    ['pdf']: require('../assets/icon/information_file/pdf.png'),
-    ['xls']: require('../assets/icon/information_file/xls.png'),
-    ['zip']: require('../assets/icon/information_file/doc.png'),
-    ['doc_bg']: require('../assets/icon/information_file/doc_bg.png'),
-    ['ppt_bg']: require('../assets/icon/information_file/ppt_bg.png'),
-    ['pdf_bg']: require('../assets/icon/information_file/pdf_bg.png'),
-    ['xls_bg']: require('../assets/icon/information_file/xls_bg.png'),
-    ['zip_bg']: require('../assets/icon/information_file/zip_bg.png'),
-    ['folder_bg']: require('../assets/icon/information_file/folder_bg.png'),
-    ['doc_refer']: require('../assets/icon/information_file/doc_refer.png'),
-    ['ppt_refer']: require('../assets/icon/information_file/ppt_refer.png'),
-    ['pdf_refer']: require('../assets/icon/information_file/pdf_refer.png'),
-    ['xls_refer']: require('../assets/icon/information_file/xlsx_refer.png'),
-    ['zip_refer']: require('../assets/icon/information_file/zip_refer.png'),
+  ["doc"]: require("../assets/icon/information_file/doc.png"),
+  ["ppt"]: require("../assets/icon/information_file/ppt.png"),
+  ["pdf"]: require("../assets/icon/information_file/pdf.png"),
+  ["xls"]: require("../assets/icon/information_file/xls.png"),
+  ["zip"]: require("../assets/icon/information_file/doc.png"),
+  ["doc_bg"]: require("../assets/icon/information_file/doc_bg.png"),
+  ["ppt_bg"]: require("../assets/icon/information_file/ppt_bg.png"),
+  ["pdf_bg"]: require("../assets/icon/information_file/pdf_bg.png"),
+  ["xls_bg"]: require("../assets/icon/information_file/xls_bg.png"),
+  ["zip_bg"]: require("../assets/icon/information_file/zip_bg.png"),
+  ["folder_bg"]: require("../assets/icon/information_file/folder_bg.png"),
+  ["doc_refer"]: require("../assets/icon/information_file/doc_refer.png"),
+  ["ppt_refer"]: require("../assets/icon/information_file/ppt_refer.png"),
+  ["pdf_refer"]: require("../assets/icon/information_file/pdf_refer.png"),
+  ["xls_refer"]: require("../assets/icon/information_file/xlsx_refer.png"),
+  ["zip_refer"]: require("../assets/icon/information_file/zip_refer.png"),
 };
 
 // 资料模块图标
 export const INFORMATION_ICON = {
-    // word文件
-    ['doc']: ICON.doc,
-    ['docx']: ICON.doc,
-    ['doc_bg']: ICON.doc_bg,
-    ['docx_bg']: ICON.doc_bg,
-    ['doc_refer']: ICON.doc_refer,
-    ['docx_refer']: ICON.doc_refer,
-    // ppt文件
-    ['ppt']: ICON.ppt,
-    ['pptx']: ICON.ppt,
-    ['ppt_bg']: ICON.ppt_bg,
-    ['pptx_bg']: ICON.ppt_bg,
-    ['ppt_refer']: ICON.ppt_refer,
-    ['pptx_refer']: ICON.ppt_refer,
-    // xls表格文件
-    ['xls']: ICON.xls,
-    ['xlsx']: ICON.xls,
-    ['xls_bg']: ICON.xls_bg,
-    ['xlsx_bg']: ICON.xls_bg,
-    ['xls_refer']: ICON.xls_refer,
-    ['xlsx_refer']: ICON.xls_refer,
-    // ptf文件
-    ['pdf']: ICON.pdf,
-    ['pdf_bg']: ICON.pdf_bg,
-    ['pdf_refer']: ICON.pdf_refer,
-    // zip压缩包文件
-    ['zip']: ICON.zip,
-    ['zip_bg']: ICON.zip_bg,
-    ['zip_refer']: ICON.zip_refer,
-    // 文件夹
-    ['folder_bg']: ICON.folder_bg,
+  // word文件
+  ["doc"]: ICON.doc,
+  ["docx"]: ICON.doc,
+  ["doc_bg"]: ICON.doc_bg,
+  ["docx_bg"]: ICON.doc_bg,
+  ["doc_refer"]: ICON.doc_refer,
+  ["docx_refer"]: ICON.doc_refer,
+  // ppt文件
+  ["ppt"]: ICON.ppt,
+  ["pptx"]: ICON.ppt,
+  ["ppt_bg"]: ICON.ppt_bg,
+  ["pptx_bg"]: ICON.ppt_bg,
+  ["ppt_refer"]: ICON.ppt_refer,
+  ["pptx_refer"]: ICON.ppt_refer,
+  // xls表格文件
+  ["xls"]: ICON.xls,
+  ["xlsx"]: ICON.xls,
+  ["xls_bg"]: ICON.xls_bg,
+  ["xlsx_bg"]: ICON.xls_bg,
+  ["xls_refer"]: ICON.xls_refer,
+  ["xlsx_refer"]: ICON.xls_refer,
+  // ptf文件
+  ["pdf"]: ICON.pdf,
+  ["pdf_bg"]: ICON.pdf_bg,
+  ["pdf_refer"]: ICON.pdf_refer,
+  // zip压缩包文件
+  ["zip"]: ICON.zip,
+  ["zip_bg"]: ICON.zip_bg,
+  ["zip_refer"]: ICON.zip_refer,
+  // 文件夹
+  ["folder_bg"]: ICON.folder_bg,
 };
-

+ 7 - 7
src/components/card/card-module/card-footer.vue

@@ -70,24 +70,24 @@ export default {
       let routePath = this.$store.state.routePath;
       let urlDict = {
         video: {
-          path: "/video-detail",
+          path: "/video-details",
           key: [
             ["id", "video_id"],
             ["videoArrId", "url_id"],
           ],
         },
         "image-text": {
-          path: "/image-text-detail",
+          path: "/image-text-details",
           key: [
-            ["article_id", "article_id"],
-            ["id", "item_id"],
+            ["id", "article_id"],
+            ["item_id", "item_id"],
           ],
         },
         information: {
-          path: "/information-detail",
+          path: "/information-details",
           key: [
-            ["datum_id", "datum_id"],
-            ["id", "url_id"],
+            ["id", "datum_id"],
+            ["url_id", "url_id"],
           ],
         },
       };

+ 115 - 0
src/components/image-text/image-text-detail-content new.vue

@@ -0,0 +1,115 @@
+<template>
+  <div class="image-text-details-content">
+    <iframe
+      class="canvas-iframe"
+      ref="canvas-iframe"
+      v-if="loading"
+      :src="'./iframe/canvas-iframe.html'"
+      :style="{
+        height: iframe_style.height + 'px',
+        width: iframe_style.width + 'px',
+      }"
+    ></iframe>
+    <div ref="canvan-content"></div>
+  </div>
+</template>
+
+<script>
+import { TripleDESDecrypt } from "@/common/util";
+import html2canvas from "html2canvas";
+
+export default {
+  name: "ImageTextDetailContent",
+  props: {
+    content: {
+      default: "",
+    },
+    isEncrypt: {
+      default: true,
+    },
+    watermark: {
+      default: "",
+    },
+  },
+  data() {
+    return {
+      createEnd: false,
+      loading: true,
+      iframe_style: {},
+    };
+  },
+  computed: {
+    userInfo() {
+      return this.$store.state.userInfo;
+    },
+  },
+  mounted() {
+    const content = this.isEncrypt
+      ? TripleDESDecrypt(this.content)
+      : this.content;
+    this.setValue(content);
+  },
+  methods: {
+    setValue(content) {
+      let that = this;
+      const canvas_iframe = this.$refs["canvas-iframe"],
+        iframe_window = canvas_iframe.contentWindow;
+      let cover =
+        this.watermark || this.userInfo.phone
+          ? this.userInfo.phone.replace(this.userInfo.phone.slice(4, 7), "****")
+          : "" || "搞一下";
+      iframe_window.onload = () => {
+        iframe_window.postMessage({ content, cover });
+      };
+      window.addEventListener("message", () => {
+        const wrap = iframe_window.document.querySelector("#wrap");
+        that.iframe_style = {
+          height: wrap.scrollHeight,
+          width: wrap.scrollWidth,
+        };
+        const content_height = wrap.scrollHeight,
+          page_height = 10000,
+          page_num = Math.ceil(content_height / page_height);
+        let promise_list = [];
+        for (let i = 0; i < page_num; i++) {
+          let option = {
+            allowTaint: true,
+            scale: 2,
+            dpi: 96,
+            y: i * 10000,
+            height:
+              i == page_num - 1
+                ? content_height - (page_num - 1) * 10000
+                : 10000,
+          };
+          promise_list.push(html2canvas(wrap, option));
+        }
+        Promise.all(promise_list).then((list) => {
+          list.forEach((item) => {
+            that.$refs["canvan-content"].appendChild(item);
+          });
+          that.loading = false;
+        });
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.image-text-details-content {
+  background: #ffffff !important;
+  z-index: 1;
+  line-height: 1.5em;
+  .content {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    user-select: none !important;
+  }
+  .canvas-iframe {
+    width: 100%;
+    border: none !important;
+  }
+}
+</style>

+ 6 - 2
src/components/image-text/image-text-recommend-card.vue

@@ -11,7 +11,11 @@
       <div class="desc">{{ info.desc }}</div>
       <div class="control">
         <div class="item" @click.stop="$emit('handleLike')">
-          <img v-if="info.is_like" src="@/assets/icon/dianzan_fill_blue.png" alt="" />
+          <img
+            v-if="info.is_like"
+            src="@/assets/icon/dianzan_fill_blue.png"
+            alt=""
+          />
           <img v-else src="@/assets/icon/dianzan_fill_black.png" alt="" />
           <span :style="{ color: info.is_like ? '#2A63F3' : '#202020' }">{{
             info.like_num
@@ -72,7 +76,7 @@ export default {
   },
   computed: {
     forword_url() {
-      return `${FORWARD_URL}/image-text-detail?id=${this.info.id}&article_id=${this.info.article_id}`;
+      return `${FORWARD_URL}/image-text-details?id=${this.info.article_id}&item_id=${this.info.id}`;
     },
   },
   methods: {

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

@@ -105,8 +105,8 @@ export default {
     handlePersonal() {
       if (!this.handleFilter()) return;
       if (this.routePath == this.personalPath) return;
-      this.$router.open(this.personalPath);
-      // this.$router.push(this.personalPath);
+      // this.$router.open(this.personalPath);
+      this.$router.push(this.personalPath);
     },
     // 取值
     handleFilter() {

+ 2 - 1
src/components/module/to-contact.vue

@@ -16,9 +16,10 @@ export default {
       contactNum: (state) => state.contact.contactNum,
     }),
     show() {
+      let hide_list = ["/information-details-content", "/pdf-view"];
       return (
         !this.$route.meta.children &&
-        this.$route.path != "/information-details-content" &&
+        !hide_list.includes(this.$route.path) &&
         localStorage.getItem("user_info")
       );
     },

+ 12 - 12
src/components/module/to-top.vue

@@ -22,18 +22,18 @@ export default {
       this.show = scrollY + 100 > innerHeight;
     },
     toTop() {
-      let height = window.scrollY / 10;
-      console.log(height);
-      let roll = setInterval((_) => {
-        let { scrollY } = window;
-        if (scrollY > height) {
-          scrollY = scrollY - height;
-          window.scrollTo(0, scrollY);
-        } else {
-          window.scrollTo(0, 0);
-          clearInterval(roll);
-        }
-      }, 10);
+      window.scrollTo({ top: 0, left: 0, behavior: "smooth" });
+      // let height = window.scrollY / 10;
+      // let roll = setInterval((_) => {
+      //   let { scrollY } = window;
+      //   if (scrollY > height) {
+      //     scrollY = scrollY - height;
+      //     window.scrollTo(0, scrollY);
+      //   } else {
+      //     window.scrollTo(0, 0);
+      //     clearInterval(roll);
+      //   }
+      // }, 10);
     },
   },
 };

+ 25 - 13
src/components/video/video-interactive.vue

@@ -54,10 +54,10 @@
       </div>
     </div>
     <div class="right">
-      <!-- <div class="related" v-if="currentVideo.pdf_clear" @click="toPPT">
+      <div class="related" v-if="currentVideo.pdf_clear" @click="toPPT">
         <img src="@/assets/icon/ppt.png" alt="" />
         <span>查看ppt</span>
-      </div> -->
+      </div>
       <div class="related" v-if="currentVideo.article_id" @click="toImageText">
         <img src="@/assets/icon/tuwen_white.png" alt="" />
         <span>跳转图文</span>
@@ -77,6 +77,7 @@
 
 <script>
 import { VideoService, CollectService, GeneralService } from "@/common/service";
+import { OSS_URL } from "@/common/config";
 import Report from "@/components/module/report.vue";
 
 export default {
@@ -162,23 +163,33 @@ export default {
     },
     // 跳转ppt
     toPPT() {
+      // console.log(this.currentVideo);
+      // return;
       this.$router.push({
-        name: "information-details-content",
-        params: {
-          datum_info: { content: "" },
-          previewable: true,
-          info: { ...this.currentVideo, url: this.currentVideo.pdf_clear },
+        path: "/pdf-view",
+        query: {
+          url: this.currentVideo.pdf_clear || this.currentVideo.ppt,
+          is_encrypt: this.currentVideo.pdf_clear ? 0 : 1,
         },
       });
+      // this.$router.push({
+      //   name: "information-details-content",
+      //   params: {
+      //     datum_info: { content: "" },
+      //     previewable: true,
+      //     info: { ...this.currentVideo, url: this.currentVideo.pdf_clear },
+      //   },
+      // });
     },
     // 跳转图文
     toImageText() {
+      if (!this.currentVideo.article_jump) return;
       if (this.currentVideo.article_item) {
         this.$router.push({
-          path: "/image-text-detail",
+          path: "/image-text-details",
           query: {
-            id: this.currentVideo.article_item,
-            article_id: this.currentVideo.article_id,
+            item_id: this.currentVideo.article_item,
+            id: this.currentVideo.article_id,
           },
         });
       } else {
@@ -192,12 +203,13 @@ export default {
     },
     // 跳转资料
     toInformation() {
+      if (!this.currentVideo.datum_jump) return;
       if (this.currentVideo.datum_item) {
         this.$router.push({
-          path: "/information-detail",
+          path: "/information-details",
           query: {
-            id: this.currentVideo.datum_item,
-            datum_id: this.currentVideo.datum_id,
+            url_id: this.currentVideo.datum_item,
+            id: this.currentVideo.datum_id,
           },
         });
       } else {

+ 24 - 22
src/components/video/video-player.vue

@@ -104,6 +104,8 @@ export default {
       isAppend: true,
       // 视频是否是vip
       videoIsVip: false,
+      // 视频是否被释放
+      videoIsRelease: false,
       // 是否登录
       isLogin: true,
       // 用户是否是vip
@@ -141,7 +143,8 @@ export default {
     this.initPlayer();
   },
   beforeDestroy() {
-    this.aliPlayer.dispose();
+    this.videoPlay();
+    this.aliPlayer && this.aliPlayer.dispose();
   },
   methods: {
     initPlayer() {
@@ -149,6 +152,8 @@ export default {
         (item) => item.id == this.videoArrId
       );
       this.videoIsVip = this.currentVideo.is_vip == 1;
+      this.videoIsRelease =
+        this.currentVideo.is_release == 1 || this.info.is_release == 1;
       this.getUserInfo();
     },
     // 获取用户信息
@@ -162,14 +167,14 @@ export default {
       if (this.videoIsVip && !this.isLogin) {
         this.$store.state.is_login.show = true;
       }
-      if (this.videoIsVip && !this.isVip) {
+      if (!this.isVip && this.videoIsVip && !this.videoIsRelease) {
         this.vipVisible = true;
       }
       if (
         video_arr.length > 0 &&
         (!this.videoIsVip ||
           (this.videoIsVip && this.isLogin && this.isVip) ||
-          this.info.is_release == 1)
+          this.videoIsRelease)
       ) {
         // 初始化播放器
         setTimeout(() => this.initAliPlayer(url, cover, ali_vid), 300);
@@ -192,12 +197,14 @@ export default {
         player.tag.setAttribute("controlsList", "nodownload noremote footbar");
         player.tag.currentTime = 0;
 
-        // 如果存在选集id则自动播放
-        if (this.videoArrId > 0) {
-          player.pause();
-          player.play();
-        }
-        player.on("play", () => this.videoPlay());
+        player.pause(); // 暂停
+        player.play(); // 播放
+
+        player.on("play", () => {
+          this.currentVideo.track_time
+            ? player.seek(Number(this.currentVideo.track_time))
+            : "";
+        });
         player.on("ended", () => (this.playEnd = true));
         player.on("autoplay", function (data) {
           if (data.paramData) {
@@ -346,11 +353,11 @@ export default {
               },
             ],
           },
-          {
-            name: "MemoryPlayComponent",
-            type: AliPlayerComponent.MemoryPlayComponent,
-            args: [false, getTime, saveTime], //args里的参数表示:第一个参数表示是否自动播放记忆时间,false为否,需要点击跳转到上次记忆的时间;第二和三个参数表示获取的时间和存入的时间
-          },
+          // {
+          //   name: "MemoryPlayComponent",
+          //   type: AliPlayerComponent.MemoryPlayComponent,
+          //   args: [false, getTime, saveTime], //args里的参数表示:第一个参数表示是否自动播放记忆时间,false为否,需要点击跳转到上次记忆的时间;第二和三个参数表示获取的时间和存入的时间
+          // },
         ].filter((item) => item),
       };
       VideoDemandService.getVideoCredentials().then(({ data }) => {
@@ -383,22 +390,17 @@ export default {
         );
       });
     },
-    // 播放回调-增加视频播放量
+    // 记录播放时间
     videoPlay() {
       if (!this.isLogin) return;
       if (this.playEnd) {
         this.playEnd = false;
         const params = {
-          video_type: 1,
           video_id: this.info.id,
           url_id: this.currentVideo.id,
+          track_time: this.aliPlayer.getCurrentTime(),
         };
-        VideoService.videoPlay(params, !this.videoIsVip).then(() => {
-          if (!/[+.wW]/.test(this.currentVideo.read_num)) {
-            this.currentVideo.read_num =
-              parseInt(this.currentVideo.read_num) + 1;
-          }
-        });
+        VideoService.videoPlay(params);
       }
     },
     // 播放下一集

+ 45 - 1
src/components/video/video-sidebar.vue

@@ -7,7 +7,21 @@
     <div class="collection">
       <div class="header">
         <div class="top">
-          <div class="title">{{ info.title }}</div>
+          <div class="title" :class="{ 'show-title': show_title }">
+            {{ info.title }}
+            <div ref="title-template" class="title-template">
+              {{ info.title }}
+            </div>
+          </div>
+          <img
+            class="show-btn"
+            src="@/assets/icon/back.png"
+            v-if="title_width > 180"
+            :style="{
+              transform: show_title ? 'rotate(90deg)' : 'rotate(270deg)',
+            }"
+            @click="show_title = !show_title"
+          />
           <div
             class="subscribe"
             v-if="info.follow_switch == 0"
@@ -81,8 +95,13 @@ export default {
   data() {
     return {
       type: "list",
+      title_width: 0,
+      show_title: false,
     };
   },
+  mounted() {
+    this.title_width = this.$refs["title-template"].offsetWidth;
+  },
   methods: {
     // 订阅
     switchSet() {
@@ -141,6 +160,7 @@ export default {
         display: flex;
         align-items: center;
         justify-content: space-between;
+        position: relative;
         .title {
           font-size: 20px;
           font-weight: 500;
@@ -149,6 +169,29 @@ export default {
           white-space: nowrap;
           text-overflow: ellipsis;
           overflow: hidden;
+          position: relative;
+          height: 25px;
+          .title-template {
+            position: absolute;
+            top: 0;
+            left: 0;
+            opacity: 0;
+          }
+        }
+        .show-title {
+          height: 50px;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 2;
+          white-space: wrap;
+        }
+        .show-btn {
+          position: absolute;
+          top: 10px;
+          left: 190px;
+          width: 7px;
+          height: 14px;
         }
         .subscribe {
           width: 80px;
@@ -219,6 +262,7 @@ export default {
           .cover {
             width: 100%;
             height: 100%;
+            object-fit: cover;
           }
           .vip {
             width: 16px;

+ 4 - 0
src/main.js

@@ -1,6 +1,8 @@
 import Vue from "vue";
 import App from "./App.vue";
 
+// 禁止复制
+import { setCopyFlag } from "@/common/util";
 // rem适配
 // import "lib-flexible/flexible";
 import "./lib/flexible.js";
@@ -45,6 +47,8 @@ window.onkeydown =
       }
     };
 
+setCopyFlag();
+
 new Vue({
   router: router,
   render: (h) => h(App),

+ 0 - 160
src/router/activity-routes.js

@@ -1,160 +0,0 @@
-// 资料路由
-export const activityRoutes = [
-    // 图文
-    {
-    	path: '/activity',
-    	component: () => import('../views/activity/activity.vue'),
-    	meta: {
-    		title: '活动', // 页面标题title
-    		keepAlive: true, // 开启缓存
-    		// 仅前往这些页面时缓存
-    		toPagesKeep: [
-    			'/report',
-    			'/image-text-search',
-    			'/image-text-details',
-    			'/free-information',
-    			'/paid-contribution-video',
-				'/image-text-collection-list'
-    		],
-    	},
-    },
-	// 图文-详情
-	{
-		path: '/activity-detail',
-		component: () => import('../views/activity/activity-detail.vue'),
-		meta: {
-			title: '图文-详情', // 页面标题title
-		},
-	},
-	// 图文模块-合集列表
-	{
-		path: '/activityList',
-		component: () => import('../views/activity/activityList.vue'),
-		meta: {
-			title: '活动列表', // 页面标题title
-			keepAlive: true, // 开启缓存
-		},
-	},
-	// 图文模块-无偿投稿文章
-	{
-		path: '/activity-sign-up',
-		component: () => import('../views/activity/activity-sign-up.vue'),
-		meta: {
-			title: '立即报名', // 页面标题title
-			keepAlive: true, // 开启缓存
-		},
-	},
-	// 发票抬头
-	{
-		path: '/activity_ticket_title',
-		component: () => import('../views/activity/activity_ticket_title.vue'),
-		meta: { 
-			title: '发票抬头', // 页面标题title
-		},
-	},
-	// 发票抬头
-	{
-		path: '/activity_ticket_select',
-		component: () => import('../views/activity/activity_ticket_select.vue'),
-		meta: {
-			title: '发票抬头', // 页面标题title
-		},
-	},
-	// 报名成功
-	{
-		path: '/activity-sign-up-success',
-		component: () => import('../views/activity/activity-sign-up-success.vue'),
-		meta: {
-			title: '报名成功', // 页面标题title
-		},
-	},
-	// 立即支付
-	{
-		path: '/activity_pay',
-		component: () => import('../views/activity/activity_pay.vue'),
-		meta: {
-			title: '立即支付', // 页面标题title
-		},
-	},
-	// 支付成功
-	{
-		path: '/activity_pay_success',
-		component: () => import('../views/activity/activity_pay_success.vue'),
-		meta: {
-			title: '支付成功', // 页面标题title
-		},
-	},
-	// 个人中心列表
-	{
-		path: '/activity-tab-list',
-		component: () => import('../views/activity/activity-tab-list.vue'),
-		meta: {
-			title: '列表', // 页面标题title
-		},
-	},
-	// 我的报名
-	{
-		path: '/activity-sign-up-list',
-		component: () => import('../views/activity/activity-sign-up-list'),
-		meta: {
-			title: '我的报名', // 页面标题title
-		},
-	},
-	// 门票信息
-	{
-		path: '/activity_ticket_info',
-		component: () => import('../views/activity/activity_ticket_info.vue'),
-		meta: {
-			title: '门票信息', // 页面标题title
-		},
-	},
-	// 我的发布
-	{
-		path: '/activity_my_release',
-		component: () => import('../views/activity/activity_my_release.vue'),
-		meta: {
-			title: '我的发布', // 页面标题title
-		},
-	},
-	// 我的消息
-	{
-		path: '/activity_my_message',
-		component: () => import('../views/activity/activity_my_message.vue'),
-		meta: {
-			title: '我的消息', // 页面标题title
-		},
-	},
-	// 订单
-	{
-		path: '/activity_order',
-		component: () => import('../views/activity/activity_order.vue'),
-		keepAlive: true, // 开启缓存
-		meta: {
-			title: '我的订单', // 页面标题title
-		},
-	},
-	//历史
-	{
-		path: '/activity_history',
-		component: () => import('../views/activity/activity_history.vue'),
-		meta: {
-			title: '图文-学历历史', // 页面标题title
-		},
-	},
-	// 订单详情
-	{
-		path: '/activity_order_info',
-		component: () => import('../views/activity/activity_order_info.vue'),
-		meta: {
-			title: '订单详情', // 页面标题title
-		},
-	},
-	// 发票详情
-	{
-		path: '/activity_bill_info',
-		component: () => import('../views/activity/activity_bill_info.vue'),
-		meta: {
-			title: '发票详情', // 页面标题title
-		},
-	},
-];

+ 3 - 3
src/router/image-text-routes.js

@@ -100,9 +100,9 @@ export const imageTextRoutes = [
     },
   },
   {
-    path: "/image-text-detail",
-    name: "image-text-detail",
-    component: () => import("@/views/image-text/image-text-detail.vue"),
+    path: "/image-text-details",
+    name: "image-text-details",
+    component: () => import("@/views/image-text/image-text-details.vue"),
     meta: {
       title: "图文-图文详情", // 页面标题title
       empty: ["Navbar"],

+ 14 - 6
src/router/index.js

@@ -2,9 +2,6 @@ import VueRouter from "vue-router";
 import store from "@/store";
 import { UserCenterService } from "@/common/service";
 import { getFacilityType } from "@/common/util";
-// import {
-// 	setCopyFlag
-// } from "@/common/util";
 
 // import {
 // 	supplierRoutes
@@ -88,6 +85,16 @@ const routes = [
       fill: true,
     },
   },
+  // pdf预览
+  {
+    path: "/pdf-view",
+    component: () => import("../views/pdf/pdf-view-iframe.vue"),
+    meta: {
+      title: "pdf", // 页面标题title
+      empty: ["Header", "Navbar"],
+      fill: true,
+    },
+  },
 ];
 
 const router = new VueRouter({
@@ -185,6 +192,7 @@ function leavePage(to, from) {
 
 // 跳转详情打开新窗口
 function openNewWindow(to, from) {
+  return false;
   if (from.path == "/") return false;
   if (detailList.includes(to.path)) {
     let url = `${location.href.split("/#/")[0]}/#${to.path}?`;
@@ -207,9 +215,9 @@ const contributeList = [
 
 // 详情页面
 const detailList = [
-  "/video-detail",
-  "/image-text-detail",
-  "/information-detail",
+  "/video-details",
+  "/image-text-details",
+  "/information-details",
 ];
 
 router.beforeEach((to, from, next) => {

+ 3 - 3
src/router/information-routes.js

@@ -93,9 +93,9 @@ export const informationRoutes = [
     },
   },
   {
-    path: "/information-detail",
-    name: "information-detail",
-    component: () => import("@/views/information/information-detail.vue"),
+    path: "/information-details",
+    name: "information-details",
+    component: () => import("@/views/information/information-details.vue"),
     meta: {
       title: "资料-资料详情", // 页面标题title
       empty: ["Navbar"],

+ 0 - 163
src/router/supplier-routes.js

@@ -1,163 +0,0 @@
-// 资料路由
-export const supplierRoutes = [
-    // 供应商
-	{
-		path: '/supplier',
-		component: () => import('../views/supplier/supplier.vue'),
-		meta: {
-			title: '供应商', // 页面标题title
-			keepAlive: true, // 开启缓存
-			// 仅前往这些页面时缓存
-			toPagesKeep: [
-				'/supplier-details',
-				'/supplier-collection',
-				'/supplier-search',
-			],
-		},
-	},
-   // 供应商
-	{
-		path: '/supplier-tab-list',
-		component: () => import('../views/supplier/supplier-tab-list.vue'),
-		meta: {
-			title: '供应商', // 页面标题title
-		},
-	},
-	// 个人中心-资料-评论我的
-    {
-        path: '/supplier-comment-on-my',
-        component: () => import('../views/supplier/supplier-comment-on-my.vue'),
-        meta: {
-            title: '资料-评论我的', // 页面标题title
-        },
-    },
-	 // 个人中心-资料-回复我的
-	 {
-        path: '/supplier-reply-to-me',
-        component: () => import('../views/supplier/supplier-reply-to-me.vue'),
-        meta: {
-            title: '资料-回复我的', // 页面标题title
-        },
-    },
-	// 个人中心-资料-我的评论
-    {
-        path: '/supplier-my-comments',
-        component: () => import('../views/supplier/supplier-my-comments.vue'),
-        meta: {
-            title: '资料-我的评论', // 页面标题title
-        },
-    },
-	// 个人中心-资料-我的回复
-    {
-        path: '/supplier-my-reply',
-        component: () => import('../views/supplier/supplier-my-reply.vue'),
-        meta: {
-            title: '资料-我的回复', // 页面标题title
-        },
-    },
-	 // 个人中心-资料-我的点赞
-	 {
-        path: '/supplier-my-likes',
-        component: () => import('../views/supplier/supplier-my-likes.vue'),
-        meta: {
-            title: '资料-我的点赞', // 页面标题title
-        },
-    },
-	// 个人中心-资料-点赞我的
-    {
-        path: '/supplier-like-me',
-        component: () => import('../views/supplier/supplier-like-me.vue'),
-        meta: {
-            title: '资料-点赞我的', // 页面标题title
-        },
-    },
-	// 个人中心-资料-我的订阅
-    {
-        path: '/supplier-my-subscriptions',
-        component: () => import('../views/supplier/supplier-my-subscriptions.vue'),
-        meta: {
-            title: '资料-我的订阅', // 页面标题title
-        },
-		keepAlive: true, // 开启缓存
-    },
-	// 供应商-我的收藏
-    {
-        path: '/supplier-my-collection',
-        component: () => import('../views/supplier/supplier-my-collection.vue'),
-        meta: {
-            title: '资料-我的收藏', // 页面标题title
-        },
-    },
-	// 供应商-我的发布
-    {
-        path: '/supplier-my-release',
-        component: () => import('../views/supplier/supplier-my-release.vue'),
-        meta: {
-            title: '资料-我的发布', // 页面标题title
-        },
-    },
-	// 供应商详情
-	{
-		path: '/supplier-details',
-		component: () => import('../views/supplier/supplier-details.vue'),
-		meta: {
-			title: '供应商详情', // 页面标题title
-		},
-	},
-// 	// 供应商-联系
-// 	{
-// 		path: '/supplier-contact',
-// 		component: () => import('../views/supplier/supplier-contact.vue'),
-// 		meta: {
-// 			title: '联系我们', // 页面标题title
-// 		},
-// 	},
-// 	// 供应商-合集
-	{
-		path: '/supplier-collection',
-		component: () => import('../views/supplier/supplier-collection.vue'),
-		meta: {
-			title: '合集内容', // 页面标题title
-		},
-	},
-	// 供应商-合集
-	{
-		path: '/supplierCollection',
-		component: () => import('../views/supplier/supplierCollection.vue'),
-		meta: {
-			title: '合集内容', // 页面标题title
-		},
-	},
-	// 供应商-浏览记录
-	{
-		path: '/supplier-history',
-		component: () => import('../views/supplier/supplier-history.vue'),
-		meta: {
-			title: '浏览记录', // 页面标题title
-		},
-	},
-// 	// 供应商-我的收藏
-// 	{
-// 		path: '/supplier-my-collection',
-// 		component: () => import('../views/supplier/supplier-my-collection.vue'),
-// 		meta: {
-// 			title: '我的收藏', // 页面标题title
-// 		},
-// 	},
-	// 供应商-搜索
-	{
-		path: '/supplier-search',
-		component: () => import('../views/supplier/supplier-search.vue'),
-		meta: {
-			title: '搜索', // 页面标题title
-		},
-	},
-// 	// 供应商-我的点赞
-// 	{
-// 		path: '/supplier-my-likes',
-// 		component: () => import('../views/supplier/supplier-my-likes.vue'),
-// 		meta: {
-// 			title: '我的点赞', // 页面标题title
-// 		},
-// 	},
-];

+ 3 - 3
src/router/video-routes.js

@@ -87,9 +87,9 @@ export const videoRoutes = [
     ],
   },
   {
-    path: "/video-detail",
-    name: "video-detail",
-    component: () => import("@/views/video/video-detail.vue"),
+    path: "/video-details",
+    name: "video-details",
+    component: () => import("@/views/video/video-details.vue"),
     meta: {
       title: "视频-视频详情", // 页面标题title
       empty: ["Navbar"],

+ 34 - 2
src/store/modules/contact.js

@@ -1,5 +1,6 @@
 const state = {
   contactNum: 0,
+  is_open: false,
   configId: "3cf9af90-d18a-4ace-8a05-eeaa3cd43206",
   config: {
     hide: true, // 是否隐藏小的悬浮按钮(联系客服)
@@ -29,16 +30,47 @@ const mutations = {
       description: "",
       qq: "",
     };
-    config.onmessage = () => {
-      state.contactNum++;
+    config.onmessage = ({ message }) => {
+      !state.is_open ? state.contactNum++ : "";
+      const showMsg = localStorage.getItem("notification") !== "denied", // granted(允许) || denied(拒绝)
+        notification =
+          window.Notification ||
+          window.mozNotification ||
+          window.webkitNotification;
+      if (!showMsg) return;
+      new notification(
+        "客服信息", // title标题
+        {
+          dir: "auto", // 文字的方向;它的值可以是 auto(自动), ltr(从左到右), or rtl(从右到左)
+          lang: "zh-CN", // 指定通知中所使用的语言
+          body: message.data, // 通知中额外显示的字符串
+          tag: tag, // 赋予通知一个ID,以便在必要的时候对通知进行刷新、替换或移除
+          icon: "./favicon.ico", // 将被用于显示通知的图标,可使用import引入,也可以填写图标存放路径
+        }
+      );
     };
     config.onopen = () => {
+      state.is_open = true;
       state.contactNum = 0;
+
+      const notification =
+        window.Notification ||
+        window.mozNotification ||
+        window.webkitNotification;
+      notification.requestPermission((result) => {
+        // granted(允许) || denied(拒绝)
+        if (result == "denied")
+          return localStorage.setItem("notification", result);
+      });
+    };
+    config.onclose = () => {
+      state.is_open = false;
     };
   },
   OPEN_CONTACT: (state) => {
     if (!localStorage.getItem("user_info")) return;
     window.easemobim.bind(state.config);
+    state.is_open = true;
   },
   CLOSE_CONTACT: () => {
     window.easemobim.minimize();

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

@@ -197,10 +197,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

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

@@ -243,10 +243,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

+ 3 - 3
src/views/image-text/children/my-chasingFun.vue

@@ -278,10 +278,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

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

@@ -201,10 +201,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

+ 3 - 3
src/views/image-text/children/my-comment.vue

@@ -143,10 +143,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

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

@@ -271,10 +271,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

+ 3 - 3
src/views/image-text/children/my-release.vue

@@ -134,10 +134,10 @@ export default {
         return this.$message.error("该图文已下架");
       if (this.type && item.status != 1) return;
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

+ 3 - 3
src/views/image-text/children/my-reply.vue

@@ -144,10 +144,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

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

@@ -196,10 +196,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

+ 3 - 3
src/views/image-text/children/study-history.vue

@@ -165,10 +165,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该图文已下架");
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id: item[key.id],
-          article_id: item[key.article_id],
+          item_id: item[key.id],
+          id: item[key.article_id],
         },
       });
     },

+ 3 - 3
src/views/image-text/components/content.vue

@@ -244,10 +244,10 @@ export default {
     toDetail(article_id, id) {
       !this.current
         ? this.$router.push({
-            path: "/image-text-detail",
+            path: "/image-text-details",
             query: {
-              id,
-              article_id,
+              id: article_id,
+              item_id: id,
             },
           })
         : this.$router.push({

+ 8 - 5
src/views/image-text/image-text-collection.vue

@@ -28,7 +28,10 @@
           v-for="(item, index) in info.item_list"
           @click="toDetail(item.article_id, item.id)"
         >
-          <ImageTextCollectionCard :info="item" :index="index" />
+          <ImageTextCollectionCard
+            :info="item"
+            :index="sort_type == 2 ? index : info.item_list.length - 1 - index"
+          />
         </div>
       </div>
     </div>
@@ -46,7 +49,7 @@ export default {
   data() {
     return {
       info: {},
-      sort_type: 1,
+      sort_type: 2,
     };
   },
   mounted() {
@@ -81,10 +84,10 @@ export default {
     // 跳转详情
     toDetail(article_id, id) {
       this.$router.push({
-        path: "/image-text-detail",
+        path: "/image-text-details",
         query: {
-          id,
-          article_id,
+          id: article_id,
+          item_id: id,
         },
       });
     },

+ 11 - 12
src/views/image-text/image-text-detail.vue → src/views/image-text/image-text-details.vue

@@ -45,7 +45,7 @@
 import { ArticleService, GeneralService } from "@/common/service";
 import DetailTitle from "@/components/module/detail-title.vue";
 import DetailInteractive from "@/components/module/detail-interactive.vue";
-import ImageTextDetailContent from "@/components/image-text/image-text-detail-content.vue";
+import ImageTextDetailContent from "@/components/image-text/image-text-detail-content new.vue";
 import Comment from "@/components/module/comment.vue";
 import CommentAll from "@/components/module/comment-all.vue";
 import Report from "@/components/module/report.vue";
@@ -108,10 +108,10 @@ export default {
   },
   created() {
     const option = this.$route.query;
-    this.article_info.id = option.article_id;
-    this.info.id = option.id;
-    if (option.article_id) this.getSeriesDetail();
-    if (option.id) this.getDetail();
+    this.article_info.id = option.id;
+    this.info.id = option.item_id;
+    if (option.id) this.getSeriesDetail();
+    if (option.item_id) this.getDetail();
     this.$store.dispatch("getMarkNum", "imageText");
   },
   mounted() {
@@ -158,7 +158,7 @@ export default {
     // 跳转视频
     toVideoDetail() {
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: this.info.video_id,
           videoArrId: this.info.video_item,
@@ -169,10 +169,10 @@ export default {
     toInformationDetail() {
       if (this.info.datum_item) {
         this.$router.push({
-          path: "/information-detail",
+          path: "/information-details",
           query: {
-            id: this.info.datum_item,
-            datum_id: this.info.datum_id,
+            url_id: this.info.datum_item,
+            id: this.info.datum_id,
           },
         });
       } else {
@@ -250,9 +250,8 @@ export default {
   }
   .content {
     margin-top: 30px;
-
-    width: calc(100% - 60px);
-    padding: 30px;
+    width: calc(100% - 120px);
+    padding: 30px 60px;
     background-color: white;
   }
   .vip-content {

+ 7 - 7
src/views/index.vue

@@ -202,19 +202,19 @@ export default {
     toDetail(item) {
       let detailDict = {
         video: {
-          link: "/video-detail",
+          link: "/video-details",
           first_id: "id",
           second_id: "videoArrId",
         },
         article: {
-          link: "/image-text-detail",
-          first_id: "article_id",
-          second_id: "id",
+          link: "/image-text-details",
+          first_id: "id",
+          second_id: "item_id",
         },
         datum: {
-          link: "/information-detail",
-          first_id: "datum_id",
-          second_id: "id",
+          link: "/information-details",
+          first_id: "id",
+          second_id: "url_id",
         },
       };
       let place = detailDict[item.place],

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

@@ -194,10 +194,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

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

@@ -246,10 +246,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

+ 3 - 3
src/views/information/children/my-chasingFun.vue

@@ -277,10 +277,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

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

@@ -200,10 +200,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

+ 3 - 3
src/views/information/children/my-comment.vue

@@ -143,10 +143,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

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

@@ -270,10 +270,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

+ 3 - 3
src/views/information/children/my-release.vue

@@ -132,10 +132,10 @@ export default {
         return this.$message.error("该资料已下架");
       if (this.type && item.status != 1) return;
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

+ 3 - 3
src/views/information/children/my-reply.vue

@@ -144,10 +144,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

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

@@ -194,10 +194,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

+ 3 - 3
src/views/information/children/study-history.vue

@@ -165,10 +165,10 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该资料已下架");
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id: item[key.id],
-          datum_id: item[key.datum_id],
+          url_id: item[key.id],
+          id: item[key.datum_id],
         },
       });
     },

+ 3 - 3
src/views/information/components/content.vue

@@ -218,10 +218,10 @@ export default {
     toDetail(datum_id, id) {
       !this.current
         ? this.$router.push({
-            path: "/information-detail",
+            path: "/information-details",
             query: {
-              id,
-              datum_id,
+              url_id: id,
+              id: datum_id,
             },
           })
         : this.$router.push({

+ 15 - 14
src/views/information/information-collection.vue

@@ -40,12 +40,12 @@
       </div>
     </div>
     <div class="list" v-if="!manageType">
-      <div
-        class="list-item"
-        v-for="(item, index) in !manageType ? info.url_arr : download_list"
-      >
+      <div class="list-item" v-for="(item, index) in info.url_arr">
         <div class="card" @click="toDetail(item.datum_id, item.id)">
-          <InformationCollectionCard :info="item" :index="index" />
+          <InformationCollectionCard
+            :info="item"
+            :index="sort_type == 1 ? index : info.url_arr.length - 1 - index"
+          />
         </div>
       </div>
     </div>
@@ -58,7 +58,7 @@
           ></el-checkbox>
         </div>
         <div class="card" :style="{ width: 'calc(100% - 60px)' }">
-          <InformationCollectionCard :info="item" />
+          <InformationCollectionCard :info="item" :index="item.index" />
         </div>
       </div>
     </div>
@@ -160,7 +160,8 @@ export default {
       }).then(({ data }) => {
         this.info = data.detail;
         this.download_list = data.detail.url_arr;
-        this.download_list = data.detail.url_arr.filter((item) => {
+        this.download_list = data.detail.url_arr.filter((item, index) => {
+          this.$set(item, "index", index);
           this.$set(item, "checked", false);
           return item.is_down ? item : false;
         });
@@ -178,17 +179,17 @@ export default {
     // 跳转详情
     toDetail(datum_id, id) {
       this.$router.push({
-        path: "/information-detail",
+        path: "/information-details",
         query: {
-          id,
-          datum_id,
+          url_id: id,
+          id: datum_id,
         },
       });
     },
     // 跳转视频
     toVideoDetail() {
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: this.info.video_id,
           videoArrId: this.info.video_item,
@@ -199,10 +200,10 @@ export default {
     toImageTextDetail() {
       if (this.info.article_item) {
         this.$router.push({
-          path: "/image-text-detail",
+          path: "/image-text-details",
           query: {
-            id: this.info.article_item,
-            article_id: this.info.article_id,
+            item_id: this.info.article_item,
+            id: this.info.article_id,
           },
         });
       } else {

+ 8 - 8
src/views/information/information-detail.vue → src/views/information/information-details.vue

@@ -121,10 +121,10 @@ export default {
   },
   created() {
     const option = this.$route.query;
-    this.datum_info.id = option.datum_id;
-    this.info.id = option.id;
-    if (option.datum_id) this.getSeriesDetail();
-    if (option.id) this.getDetail();
+    this.datum_info.id = option.id;
+    this.info.id = option.url_id;
+    if (option.id) this.getSeriesDetail();
+    if (option.url_id) this.getDetail();
     this.$store.dispatch("getMarkNum", "information");
   },
   mounted() {
@@ -175,7 +175,7 @@ export default {
     // 跳转视频
     toVideoDetail() {
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: this.info.video_id,
           videoArrId: this.info.video_item,
@@ -186,10 +186,10 @@ export default {
     toImageTextDetail() {
       if (this.info.article_item) {
         this.$router.push({
-          path: "/image-text-detail",
+          path: "/image-text-details",
           query: {
-            id: this.info.article_item,
-            article_id: this.info.article_id,
+            item_id: this.info.article_item,
+            id: this.info.article_id,
           },
         });
       } else {

+ 30 - 0
src/views/pdf/pdf-view-iframe.vue

@@ -0,0 +1,30 @@
+<template>
+  <div class="wrap">
+    <Pdf ref="jsPdf" :pdfUrl="pdf_src" :is_encrypt="is_encrypt" />
+  </div>
+</template>
+
+<script>
+import Pdf from "@/components/pdf/index.vue";
+export default {
+  components: { Pdf },
+  data() {
+    return {
+      pdf_src: "",
+      is_encrypt: 0,
+    };
+  },
+  mounted() {
+    const { url, is_encrypt } = this.$route.query;
+    this.pdf_src = encodeURI(url) || "";
+    this.is_encrypt = Number(is_encrypt);
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.wrap {
+  margin-top: -80px;
+  height: calc(100vh - 15px);
+}
+</style>

+ 197 - 0
src/views/pdf/pdf-view.vue

@@ -0,0 +1,197 @@
+<template>
+  <div class="home_wrap">
+    <el-button @click="visible = true" style="position: fixed">目录</el-button>
+    <div class="pdf_down">
+      <div class="pdf_set_left" @click="scaleD()">放大</div>
+      <div class="pdf_set_middle" @click="scaleX()">缩小</div>
+    </div>
+
+    <div
+      ref="getheight"
+      id="scrollBox"
+      :style="{ width: pdf_div_width, margin: '0 auto' }"
+    >
+      <canvas
+        v-for="page in pdf_pages"
+        :id="'the_canvas' + page"
+        :key="page"
+      ></canvas>
+    </div>
+    <el-drawer
+      title="目录"
+      direction="ltr"
+      :modal="false"
+      :visible.sync="visible"
+      :before-close="() => (visible = false)"
+    >
+      <el-tree
+        :data="gData"
+        :props="{
+          children: 'items',
+          label: 'title',
+        }"
+        @node-click="handleSelect"
+      ></el-tree>
+    </el-drawer>
+  </div>
+</template>
+
+<script>
+let PDFJS = require("pdfjs-dist");
+PDFJS.GlobalWorkerOptions.workerSrc = require("pdfjs-dist/build/pdf.worker.entry.js");
+export default {
+  data() {
+    return {
+      pageArr: [],
+      gData: [],
+      visible: false,
+      pdf_scale: 1.0, //pdf放大系数
+      pdf_pages: 0,
+      pdf_div_width: "",
+      pdf_src: null,
+    };
+  },
+  mounted() {
+    this.get_pdfurl();
+  },
+  methods: {
+    get_pdfurl() {
+      const option = this.$route.query;
+      this.pdf_src = encodeURI(option.url) || "";
+      this._loadFile(this.pdf_src);
+    },
+    handleSelect(val, node) {
+      if (!node.isLeaf) return;
+      // this.pdfDoc.getPageIndex(val.dest[0]).then((res) => {
+      //   console.log(res);
+      // });
+      return console.log(val);
+      let height = this.$refs.getheight.offsetHeight - 1000;
+      window.scrollTo({
+        top:
+          height *
+          (val.dest[0].num / this.pageArr[this.pageArr.length - 1].num),
+      });
+    },
+    scaleD() {
+      //放大
+      let max = 0;
+      if (window.screen.width > 1440) {
+        max = 1.4;
+      } else {
+        max = 1.2;
+      }
+      if (this.pdf_scale >= max) {
+        return;
+      }
+      this.pdf_scale = this.pdf_scale + 0.1;
+      this._loadFile(this.pdf_src);
+    },
+    scaleX() {
+      //缩小
+      let min = 1.0;
+      if (this.pdf_scale <= min) {
+        return;
+      }
+      this.pdf_scale = this.pdf_scale - 0.1;
+      this._loadFile(this.pdf_src);
+    },
+    _loadFile(url) {
+      //初始化pdf
+      let loadingTask = PDFJS.getDocument(url);
+      loadingTask.promise.then((pdf) => {
+        this.pdfDoc = pdf;
+        this.pdf_pages = this.pdfDoc.numPages;
+
+        // this.$nextTick(() => {
+        this._renderPage(1);
+        // });
+      });
+    },
+    _renderPage(num) {
+      //渲染pdf页
+      const that = this;
+      this.pdfDoc.getPage(num).then((page) => {
+        that.pageArr.push(page.ref);
+        let canvas = document.getElementById("the_canvas" + num);
+        let ctx = canvas.getContext("2d");
+        let dpr = window.devicePixelRatio || 1;
+        let bsr =
+          ctx.webkitBackingStorePixelRatio ||
+          ctx.mozBackingStorePixelRatio ||
+          ctx.msBackingStorePixelRatio ||
+          ctx.oBackingStorePixelRatio ||
+          ctx.backingStorePixelRatio ||
+          1;
+        let ratio = dpr / bsr;
+        let viewport = page.getViewport({ scale: this.pdf_scale });
+
+        canvas.width = viewport.width * ratio;
+        canvas.height = viewport.height * ratio;
+
+        canvas.style.width = viewport.width + "px";
+
+        that.pdf_div_width = viewport.width + "px";
+
+        canvas.style.height = viewport.height + "px";
+
+        ctx.setTransform(ratio, 0, 0, ratio, 0, 0);
+        let renderContext = {
+          canvasContext: ctx,
+          viewport: viewport,
+        };
+        page.render(renderContext);
+        if (this.pdf_pages > num) {
+          this._renderPage(num + 1);
+        }
+        this.$nextTick(() => {
+          this.pdfDoc.getOutline().then((directory) => {
+            // 获取pdf目录
+            this.gData = directory;
+          });
+        });
+      });
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.home_wrap {
+  width: 100%;
+  height: 100%;
+  margin-top: -80px;
+  .pdf_down {
+    position: fixed;
+    display: flex;
+    z-index: 20;
+    right: 26px;
+    bottom: 7%;
+    .pdf_set_left {
+      width: 30px;
+      height: 40px;
+      color: #408fff;
+      font-size: 11px;
+      padding-top: 25px;
+      text-align: center;
+      margin-right: 5px;
+      cursor: pointer;
+    }
+    .pdf_set_middle {
+      width: 30px;
+      height: 40px;
+      color: #408fff;
+      font-size: 11px;
+      padding-top: 25px;
+      text-align: center;
+      margin-right: 5px;
+      cursor: pointer;
+    }
+  }
+}
+html {
+  background: #ccc;
+}
+canvas {
+  border-radius: 10px;
+}
+</style>

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

@@ -194,7 +194,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -239,7 +239,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

+ 1 - 1
src/views/video/children/my-buy.vue

@@ -151,7 +151,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

+ 1 - 1
src/views/video/children/my-chasingFun.vue

@@ -275,7 +275,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -206,7 +206,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -143,7 +143,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -276,7 +276,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

+ 1 - 1
src/views/video/children/my-release.vue

@@ -140,7 +140,7 @@ export default {
         return this.$message.error("该视频已下线");
       if (this.type && item.status != 1) return;
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -144,7 +144,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -194,7 +194,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

+ 1 - 1
src/views/video/children/study-history.vue

@@ -165,7 +165,7 @@ export default {
       if (Object.keys(item).includes("is_normal") && !item.is_normal)
         return this.$message.error("该视频已下线");
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id: item[key.id],
           videoArrId: item[key.videoArrId],

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

@@ -248,7 +248,7 @@ export default {
     // 跳转详情
     toDetail(id, videoArrId) {
       this.$router.push({
-        path: "/video-detail",
+        path: "/video-details",
         query: {
           id,
           videoArrId,

+ 17 - 13
src/views/video/video-detail.vue → src/views/video/video-details.vue

@@ -105,7 +105,7 @@ export default {
   },
   created() {
     this.videoArrId = this.$route.query.videoArrId;
-    this.getDetail(this.$route.query.id);
+    this.getDetail();
     this.is_login ? this.$store.dispatch("getMarkNum", "video") : "";
   },
   methods: {
@@ -115,22 +115,26 @@ export default {
       let href =
         location.href.split("videoArrId=")[0] + "videoArrId=" + this.videoArrId;
       window.history.replaceState(null, null, href);
+      this.getDetail();
       this.playing = false;
       this.$forceUpdate();
     },
     // 获取视频详情
-    getDetail(id) {
-      VideoService.getVideoDetail({ id }).then(({ data }) => {
-        this.info = data.detail;
-        if (!this.videoArrId || this.videoArrId == "undefined")
-          this.changeEpisode(0);
-        this.videoArrIndex = this.info.video_arr.findIndex(
-          (item) => item.id == this.videoArrId
-        );
-        this.$nextTick((_) => {
-          this.$refs["comment"].init(this.comment_option);
-        });
-      });
+    getDetail() {
+      VideoService.getVideoDetail({ id: this.$route.query.id }).then(
+        ({ data }) => {
+          this.info = data.detail;
+          if (!this.videoArrId || this.videoArrId == "undefined")
+            this.changeEpisode(0);
+          this.videoArrIndex = this.info.video_arr.findIndex(
+            (item) => item.id == this.videoArrId
+          );
+          this.$nextTick((_) => {
+            this.$refs["comment"] &&
+              this.$refs["comment"].init(this.comment_option);
+          });
+        }
+      );
     },
   },
 };

+ 106 - 9
src/views/vip/children/account.vue

@@ -13,7 +13,7 @@
               type="file"
               accept="image/png, image/jpeg, image/jpg"
               style="display: none"
-              @change="uploadAvatar"
+              @change="changeImage"
             />
           </div>
           <div
@@ -116,6 +116,49 @@
         >
       </div>
     </el-dialog>
+    <el-dialog
+      title="上传头像"
+      center
+      width="400px"
+      v-if="cropperVisible"
+      :visible.sync="cropperVisible"
+      :before-close="
+        (done) => {
+          clearUploadInput();
+          done();
+        }
+      "
+    >
+      <div class="cropper-box">
+        <div class="cropper">
+          <vue-cropper
+            ref="cropper"
+            :img="cropperOption.img"
+            :outputSize="cropperOption.outputSize"
+            :outputType="cropperOption.outputType"
+            :canScale="cropperOption.canScale"
+            :autoCrop="cropperOption.autoCrop"
+            :autoCropWidth="cropperOption.autoCropWidth"
+            :autoCropHeight="cropperOption.autoCropHeight"
+            :canMoveBox="cropperOption.canMoveBox"
+            :canMove="cropperOption.canMove"
+            :centerBox="cropperOption.centerBox"
+            :info="cropperOption.info"
+            :fixedBox="cropperOption.fixedBox"
+          >
+          </vue-cropper>
+        </div>
+      </div>
+
+      <div slot="footer">
+        <el-button
+          type="primary"
+          v-loading="upload_loading"
+          @click="uploadAvatar"
+          >裁剪并上传</el-button
+        >
+      </div>
+    </el-dialog>
   </div>
 </template>
 
@@ -126,15 +169,33 @@ import {
   UserCenterService,
   uploadFile,
 } from "@/common/service";
-
+import { VueCropper } from "vue-cropper";
 export default {
+  components: { VueCropper },
   data() {
     return {
       avatar: require("@/assets/icon/avatar.png"),
       noneLevel: require("@/assets/icon/vip/wudengji.png"),
-      levelList: [],
-      nameVisible: false,
-      name: "",
+      levelList: [], // 等级列表
+      nameVisible: false, // 修改用户名弹窗
+      name: "", // 修改用户名
+      cropperVisible: false, // 裁切框
+      cropperOption: {
+        // 裁切配置
+        img: require("@/assets/img/index-qrcode.png"), // 裁剪图片地址,这里可以本地图片或者链接,链接不用require
+        outputSize: 1, // 裁剪生成图片质量
+        outputType: "jepg", // 裁剪生成图片格式
+        canScale: true, // 图片是否允许滚轮播放
+        autoCrop: true, // 是否默认生成截图框 false
+        info: false, // 是否展示截图框信息
+        autoCropWidth: 200, // 生成截图框的宽度
+        autoCropHeight: 200, // 生成截图框的高度
+        canMoveBox: true, // 截图框是否可以拖动
+        fixedBox: true, // 固定截图框的大小
+        canMove: false, // 上传图片是否可拖动
+        centerBox: true, // 截图框限制在图片里面
+      },
+      upload_loading: false, // 上传头像状态
     };
   },
   computed: {
@@ -180,13 +241,37 @@ export default {
         this.levelList = data.list;
       });
     },
-    // 上传用户头像
-    uploadAvatar(e) {
+    // 选择图片
+    changeImage(e) {
       const file = e.target.files[0];
-      uploadFile(file).then(({ data }) => {
-        this.changeUserInfo({ headimg: data });
+      let reader = new FileReader();
+      reader.readAsDataURL(file);
+      reader.onload = (ele) => {
+        this.cropperOption.img = ele.target.result;
+        this.cropperVisible = true;
+      };
+    },
+    // 上传用户头像
+    uploadAvatar() {
+      if (this.upload_loading) return;
+      this.upload_loading = true;
+      let that = this;
+      this.$refs["cropper"].getCropBlob((blob) => {
+        const file = new File([blob], "avatar.png", { type: blob.type });
+        uploadFile(file).then(({ data }) => {
+          that.changeUserInfo({ headimg: data });
+          that.clearUploadInput();
+          that.upload_loading = true;
+          that.cropperVisible = false;
+        });
       });
     },
+    // 清除上传内容
+    clearUploadInput() {
+      let upload = document.querySelector("#upload");
+      // upload.outerHTML = upload.outerHTML;
+      upload.value = "";
+    },
     // 修改用户信息
     changeUserInfo(params) {
       UserCenterService.updateUserInfo(params).then(({ data }) => {
@@ -245,6 +330,7 @@ export default {
           img {
             width: 100%;
             aspect-ratio: 1/1;
+            object-fit: cover;
             border-radius: 50%;
             margin-right: 15px;
             position: absolute;
@@ -380,5 +466,16 @@ export default {
       }
     }
   }
+  .cropper-box {
+    width: 100%;
+    height: 300px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .cropper {
+      width: 300px;
+      height: 300px;
+    }
+  }
 }
 </style>

+ 1 - 6
src/views/vip/vip-member.vue

@@ -202,6 +202,7 @@ export default {
       margin-top: 20px;
       display: flex;
       align-items: center;
+      justify-content: space-between;
       flex-wrap: wrap;
       .select {
         border: 4px solid #ff6700 !important;
@@ -222,9 +223,6 @@ export default {
           width: 240px;
           height: 300px;
         }
-        > :nth-child(3n-1) {
-          margin: 0 calc((100% - 240px * 3) / 2);
-        }
       }
       @media (min-width: 1600px) {
         .list-item {
@@ -238,9 +236,6 @@ export default {
             right: 0;
           }
         }
-        > :nth-child(3n-1) {
-          margin: 0 calc((100% - 30% * 3) / 2);
-        }
       }
     }
     .pay-method {