修复文物图片加载失败问题；修复点赞后无法更新的问题

src/components/ReaderOperations/index.vue

@@ -95,7 +95,7 @@
 </template>
 
 <script>
-import { mapGetters } from "vuex";
+import { mapGetters, mapActions } from "vuex";
 import { debounce, formatNum } from "@/utils/index";
 export default {
   name: "ReaderOperations",
@@ -131,67 +131,81 @@ export default {
   },
   computed: {
     ...mapGetters(["token", "showLoginDialog"]),
+    isCulturalRelic() {
+      if (!this.sourceType) {
+        return;
+      }
+      return this.sourceType == "biz_cultural_relic";
+    },
+    isExhibiton() {
+      if (!this.sourceType) {
+        return;
+      }
+      return this.sourceType == "biz_exhibition";
+    },
   },
   methods: {
-    handleCollect: debounce(function () {
+    ...mapActions("user", ["toggleCollect", "toggleLike"]),
+    handleCollect: debounce(async function () {
       if (this.token) {
         let sourceId;
         let title;
-        if (this.sourceType == "biz_cultural_relic") {
-          sourceId = this.info.crId;
-          title = this.info.name;
-        } else if (this.sourceType == "biz_exhibition") {
-          sourceId = this.info.exhibitionId;
-          title = this.info.title;
+        if (this.isCulturalRelic) {
+          const { crId, name } = this.info;
+          sourceId = crId;
+          title = name;
+        } else if (this.isExhibiton) {
+          const { exhibitionId, title } = this.info;
+          sourceId = exhibitionId;
+          title = title;
         }
         const params = {
           sourceType: this.sourceType,
           sourceId,
           title,
         };
-        this.$store.dispatch("user/toggleCollect", params).then(() => {
-          if (!this.info.collectCountStatus) {
-            // 点赞
-            this.$message.success("已收藏！");
-          } else {
-            this.$message.success("已取消收藏！");
+
+        try {
+          await this.toggleCollect(params);
+          const msg = this.info.collectCountStatus
+            ? "已取消收藏！"
+            : "已收藏！";
+          this.$message.success(msg);
+          const id = this.info.crId || this.info.exhibitionId;
+          this.$emit("reload", id);
+        } catch (error) {
+          this.$message.error("操作失败：" + error);
         }
-          setTimeout(() => {
-            this.$emit("reload", this.info.crId || this.info.exhibitionId);
-          }, 300);
-        });
-      } else {
-        this.loginDialogVisible = true;
       }
     }),
     // 点赞
-    handleLike: debounce(function () {
+    handleLike: debounce(async function () {
       if (this.token) {
         let sourceId;
         let title;
-        if (this.sourceType == "biz_cultural_relic") {
-          sourceId = this.info.crId;
-          title = this.info.name;
-        } else if (this.sourceType == "biz_exhibition") {
-          sourceId = this.info.exhibitionId;
-          title = this.info.title;
+        if (this.isCulturalRelic) {
+          const { crId, name } = this.info;
+          sourceId = crId;
+          title = name;
+        } else if (this.isExhibiton) {
+          const { exhibitionId, title } = this.info;
+          sourceId = exhibitionId;
+          title = title;
         }
         const params = {
           sourceType: this.sourceType,
           sourceId,
           title,
         };
-        this.$store.dispatch("user/toggleLike", params).then(() => {
-          if (!this.info.loveCountStatus) {
-            // 点赞
-            this.$message.success("已点赞！");
-          } else {
-            this.$message.success("已取消点赞！");
+        try {
+          await this.toggleLike(params);
+          const msg = this.info.loveCountStatus ? "已取消点赞！" : "已点赞！";
+          this.$message.success(msg);
+          const id = this.info.crId || this.info.exhibitionId;
+          this.$emit("reload", id);
+        } catch (error) {
+          this.$message.error("操作失败：" + error);
         }
-          setTimeout(() => {
-            this.$emit("reload", this.info.crId || this.info.exhibitionId);
-          }, 300);
-        });
       } else {
         this.loginDialogVisible = true;
       }

src/components/Viewer3d/index.vue

@@ -2,7 +2,7 @@
   <!-- online_3d_viewer -->
   <div
     class="online_3d_viewer"
-    model="/static/3d/yshl.FBX"
+    :model="url"
     :backgroundcolor="backgroundcolor"
   ></div>
 </template>

src/router/index.js

@@ -188,7 +188,7 @@ const routes = [
       import("@/views/3d/index.vue"),
   },
   {
-    path: "/3d/:id",
+    path: "/3dDetail",
     name: "3dDetail",
     component: () =>
       import("@/views/3d/detail.vue"),

src/store/modules/app.js

@@ -3,7 +3,7 @@ const getDefaultState = () => {
     curPath: null,
     navBarFixed: false,
     showLoginDialog: null,
-    navbarHeight:null,
+    navbarHeight: null,
     navbarStyle: '1',//1-默认蓝色；2-中国风；3-红色
   }
 }

src/utils/request.js

 import axios from 'axios'
 import {
-  MessageBox,
-  Message,
   Loading
 } from 'element-ui'
-import store from '@/store'
 import messageup from './resetMessage'
 import {
-  getToken
+  getToken,
+  removeToken,
+  removeUserInfo
 } from '@/utils/auth'
-console.log('process.env', process.env);
-// create an axios instance
+import store from '@/store'
 const service = axios.create({
   baseURL: process.env.VUE_APP_BASE_API,
   timeout: 1000 * 10,
@@ -42,9 +40,10 @@ service.interceptors.request.use(
   }
 )
 
+
 // response interceptor
 service.interceptors.response.use(
-  response => {
+  async response => {
     num--
     if (num === 0) {
       setTimeout(() => {
@@ -52,30 +51,39 @@ service.interceptors.response.use(
       }, 500);
     }
     const res = response.data
-    if (response.config.url === '/sys/getVerify') {
-
+    // 验证码接口
+    const isVerify = response.config.url === '/sys/getVerify'
+    // 组织机构树接口
+    const isSysRegionTree = response.config.url === '/sysRegion/tree'
+    // 先处理一些不需要经过拦截器的或者单独处理的
+    if (isVerify) {
       return res
     }
-
-    if (response.config.url === '/sysRegion/tree') {
+    if (isSysRegionTree) {
       let arr = res.data
       if (arr && arr.length > 0) {
         if (arr[0].code === '520000000000' && arr.length === 1) {
           arr = arr[0].children
         }
       }
-
       res.data = arr
       return res
     }
-    // debugger
-    // if the custom code is not 20000, it is judged as an error.
     if (res.code !== 0) {
       messageup({
         type: 'error',
         showClose: true,
         message: res.msg || 'Error'
       })
+      // 401001l令牌过期,此时调用logout依旧显示令牌过期，因此直接Remove用户信息
+      const isExpired = res.code === 401001
+      if (isExpired) {
+        removeToken()
+        removeUserInfo()
+        commit('RESET_STATE')
+        location.reload()
+        store.commit('app/OPEN_LOGIN_DIALOG', true)
+      }
       return Promise.reject(res.msg || 'Error')
     } else {
       return res

src/views/3d/detail.vue

 <template>
   <div class="container-3d">
-    <Viewer3d backgroundcolor="linear(0, 0, 0,40%)" />
+    <Viewer3d
+      backgroundcolor="linear(0, 0, 0,40%)"
+      :url="file3dUrl"
+      v-if="file3dUrl"
+    />
     <div class="left-text">
       <div>多彩贵州</div>
       <div>博物<br />盛筵</div>
@@ -93,7 +97,10 @@ export default {
     };
   },
   mounted() {
-    console.log(this.$router);
+    const { file3dUrl } = this.$route.query;
+    if (file3dUrl) {
+      this.file3dUrl = file3dUrl;
+    }
   },
   methods: {
     handleChangeButton(item) {

src/views/3d/index.vue

@@ -122,8 +122,16 @@ export default {
   },
   methods: {
     handleOpen3d(item) {
-      const newPage = this.$router.resolve({ path: "/3d/" + item });
-      window.open(newPage.href, "_blank");
+      const path = "/3dDetail";
+      const { file3dUrl } = item;
+      if (file3dUrl) {
+        const query = {
+          file3dUrl: encodeURI(file3dUrl),
+        };
+        this.$bizCommon.openNewPage(path, query);
+      } else {
+        this.$message.error("3d文件为空或无效！");
+      }
     },
   },
 };

src/views/culturalRelic/components/baseInfo.vue

@@ -71,12 +71,17 @@ export default {
     getPropValue(prop) {
       return this.detail[prop] || "暂无";
     },
-    loadDetail() {
-      this.$emit("loadDetail");
+    loadDetail(id) {
+      this.$emit("loadDetail", id);
     },
     handleTo3D() {
       const { file3dUrl, url3d } = this.detail;
       if (file3dUrl) {
+        const path = "/3dDetail";
+        const query = {
+          file3dUrl: encodeURI(file3dUrl),
+        };
+        this.$bizCommon.openNewPage(path, query);
         return;
       }
       if (url3d) {
@@ -106,6 +111,9 @@ export default {
       margin-right: 8px;
     }
   }
+  .view-3d {
+    cursor: pointer;
+  }
 
   .basic-info {
     color: #333;

src/views/culturalRelic/components/imgs.vue

@@ -2,11 +2,11 @@
   <div class="imgs">
     <div class="common-title">文物图片</div>
     <swiper :options="swiperOption" ref="imgSwiper">
-      <swiper-slide v-for="(item, i) in detail.imagesVo" :key="i">
+      <swiper-slide v-for="(item, i) in imagesVo" :key="i">
         <div
           title="点击查看大图"
           class="img-container"
-          @click.stop="handelPreviewImages(detail.imagesVo, i)"
+          @click.stop="handelPreviewImages(imagesVo, i)"
         >
           <img :src="$getFullUrl(item.middleUrl || item.url)" alt="" />
           <div class="search" title="搜索类似图片">
@@ -44,12 +44,29 @@ export default {
       default: () => ({}),
     },
   },
+  computed: {
+    imagesVo() {
+      if (!this.detail.imagesVo) {
+        return;
+      }
+      if (this.detail.imagesVo.length > 0) {
+        return this.detail.imagesVo;
+      } else {
+        return [
+          {
+            pressUrl: this.detail.faceImagePressUrl,
+            url: this.detail.faceImageUrl,
+            middleUrl: this.detail.faceImageMiddleUrl,
+          },
+        ];
+      }
+    },
+  },
   data() {
     return {
       swiperOption: imgSwiperOption,
     };
   },
-  mounted() {},
   methods: {
     handelPreviewImages(items, index) {
       this.imgList = items.map((item) => this.$getFullUrl(item.url));