Merge branch 'master' of https://gitee.com/gzcnki/exhibition_page

.eslintrc.js

+// .eslintrc.js
+module.exports = {
+    rules: {
+        "vue/multi-word-component-names": "off",
+    },
+};
\ No newline at end of file

src/components/LazyImg/index.vue

+<template>
+  <div class="l-img">
+    <line-img
+      :src="src"
+      :commonUrl="commonUrl"
+      v-if="type === 'line'"
+    ></line-img>
+    <local-img
+      :src="src"
+      :commonUrl="commonUrl"
+      v-if="type === 'local'"
+    ></local-img>
+  </div>
+</template>
+
+<script>
+import lineImg from "./line-img.vue";
+import localImg from "./local-img.vue";
+
+export default {
+  props: {
+    src: {
+      type: String || Object,
+      require: true,
+    },
+  },
+  components: {
+    lineImg,
+    localImg,
+  },
+  data() {
+    return {
+      commonUrl: require("@/assets/imgs/home/mini-bg.png"),
+    };
+  },
+  computed: {
+    type() {
+      let { src } = this;
+      if (
+        typeof src === "string" &&
+        src.indexOf("http://") < 0 &&
+        src.indexOf("https://") < 0
+      ) {
+        return "local";
+      } else {
+        return "line";
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.l-img {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  ::v-deep img {
+    max-width: 100%;
+    max-height: 100%;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
+</style>

src/components/LazyImg/line-img.vue

+<template>
+  <div>
+    <img
+      :src="low_url"
+      alt=""
+      @onerror="handleChangeMini($event)"
+      v-if="!isShow"
+    />
+    <img :src="src" alt="" v-show="isShow" @load="handleChangeNormal" />
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    src: {
+      type: String || Object,
+      require: true,
+    },
+    commonUrl: {
+      type: String,
+      require: true,
+    },
+  },
+  data() {
+    return {
+        isShow:false
+    }
+  },
+  computed: {
+    low_url() {
+      let { src } = this;
+      if (src && typeof src === "string") {
+        let ix = src.lastIndexOf("/");
+        return src.substr(0, ix) + "/low" + src.substr(ix);
+      } else {
+        return this.commonUrl;
+      }
+    },
+  },
+  methods: {
+    handleChangeMini(evt) {
+      let img = evt.srcElement;
+      img.src = this.commonUrl;
+      img.onerror = null;
+    },
+    handleChangeNormal() {
+      this.isShow = true;
+    },
+  },
+};
+</script>

src/components/LazyImg/local-img.vue

+<template>
+  <div>
+    <img
+      :src="low_url"
+      alt=""
+      @onerror="handleChangeMini($event)"
+      v-show="!isShow"
+    />
+    <img :src="url" alt="" v-show="isShow" @load="handleChangeNormal" />
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    src: {
+      type: String,
+      require: true,
+    },
+    commonUrl: {
+      type: String,
+      require: true,
+    },
+  },
+  data() {
+    let low = this.src;
+    // debugger;
+    if (typeof low === "string") {
+      let lowUrl = this.getLowUrl(low);
+      low = require("@/assets/imgs" + this.getUrl(lowUrl));
+    } else {
+      low = this.commonUrl;
+    }
+
+    return {
+      isShow: false,
+      low_url: low,
+      url: require("@/assets/imgs" + this.getUrl(this.src)),
+    };
+  },
+  methods: {
+    getUrl(str) {
+      let len = "@/assets/imgs".length;
+      return str.substr(len);
+    },
+    getLowUrl(src) {
+      let ix = src.lastIndexOf("/");
+      return src.substr(0, ix) + "/low" + src.substr(ix);
+    },
+    handleChangeMini(evt) {
+      let img = evt.srcElement;
+      img.src = this.commonUrl;
+      img.onerror = null;
+    },
+    handleChangeNormal() {
+        console.log(this.src)
+      this.isShow = true;
+    },
+  },
+};
+</script>

src/main.js

@@ -17,6 +17,9 @@ import 'vue-video-player/src/custom-theme.css'
 
 Vue.use(VideoPlayer)
 
+import LImg from '@/components/LazyImg'
+Vue.component('LImg', LImg)
+
 import {
   getFullUrl
 } from '@/utils/index'

src/router/index.js

-import Vue from 'vue'
-import VueRouter from 'vue-router'
-import Home from '../views/home'
+import Vue from "vue";
+import VueRouter from "vue-router";
+import Home from "../views/home";
 
-Vue.use(VueRouter)
+Vue.use(VueRouter);
 // keepAlive先全部为true 后期根据每个页面需求调整
 const routes = [
   {
-    path: '/loopswiper',
-    name: 'loop',
-    component: () => import('@/views/home/components/swiper.vue'),
+    path: "/loopswiper",
+    name: "loop",
+    component: () => import("@/views/home/components/swiper.vue"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   {
-    path: '/404',
-    component: () => import('@/views/404.vue'),
-    hidden: true
+    path: "/404",
+    component: () => import("@/views/404.vue"),
+    hidden: true,
   },
   // 首页
   {
-    path: '/',
-    name: 'home',
+    path: "/",
+    name: "home",
     component: Home,
     meta: {
-      keepAlive: false
-    }
+      keepAlive: false,
+    },
   },
   // 精品展
   {
-    path: '/boutique/:title',
-    name: 'boutique',
-    component: () => import('@/views/boutique'),
+    path: "/boutique/:title",
+    name: "boutique",
+    component: () => import("@/views/boutique"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 虚拟展厅
   {
-    path: '/virtual',
-    name: 'virtual',
-    component: () => import('@/views/virtual'),
+    path: "/virtual",
+    name: "virtual",
+    component: () => import("@/views/virtual"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 布展
   {
-    path: '/display',
-    name: 'display',
-    component: () => import('@/views/display'),
+    path: "/display",
+    name: "display",
+    component: () => import("@/views/display"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 布展详情页
   {
-    path: '/display/:themeType/:exhibitionId',
-    name: 'displayDetail',
-    component: () => import('@/views/display/Detail.vue'),
+    path: "/display/:themeType/:exhibitionId",
+    name: "displayDetail",
+    component: () => import("@/views/display/Detail.vue"),
     meta: {
-      keepAlive: false
-    }
+      keepAlive: false,
+    },
   },
   // 文物展
   {
-    path: '/culturalRelic',
-    name: 'culturalRelic',
-    component: () => import('@/views/culturalRelic'),
+    path: "/culturalRelic",
+    name: "culturalRelic",
+    component: () => import("@/views/culturalRelic"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 文物详情页
   {
-    path: '/culturalRelic/:crId',
-    name: 'culturalRelicDetail',
-    component: () => import('@/views/culturalRelic/Detail.vue'),
+    path: "/culturalRelic/:crId",
+    name: "culturalRelicDetail",
+    component: () => import("@/views/culturalRelic/Detail.vue"),
     meta: {
-      keepAlive: false
-    }
+      keepAlive: false,
+    },
   },
   // 个人中心
   {
-    path: '/personal',
-    name: 'personal',
-    component: () => import('@/views/personal'),
+    path: "/personal",
+    name: "personal",
+    component: () => import("@/views/personal"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // // 登录
   // {
@@ -102,90 +102,94 @@ const routes = [
 
   // 注册页
   {
-    path: '/register',
-    name: 'register',
-    component: () => import('@/views/register'),
+    path: "/register",
+    name: "register",
+    component: () => import("@/views/register"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 博物馆
   {
-    path: '/museum',
-    name: 'museum',
-    component: () => import('@/views/museum'),
+    path: "/museum",
+    name: "museum",
+    component: () => import("@/views/museum"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 博物馆详情
   {
-    path: '/museum/:id',
-    name: 'museumDetail',
-    component: () => import('@/views/museum/Detail.vue'),
+    path: "/museum/:id",
+    name: "museumDetail",
+    component: () => import("@/views/museum/Detail.vue"),
     meta: {
-      keepAlive: false
-    }
+      keepAlive: false,
+    },
   },
   // 文创
   {
-    path: '/ccProduct',
-    name: 'ccProduct',
-    component: () => import('@/views/ccProduct'),
+    path: "/ccProduct",
+    name: "ccProduct",
+    component: () => import("@/views/ccProduct"),
     meta: {
-      keepAlive: true
-    }
+      keepAlive: true,
+    },
   },
   // 文创详情
   {
-    path: '/ccProduct/:bccpId',
-    name: 'ccProductDetail',
-    component: () => import('@/views/ccProduct/Detail.vue'),
+    path: "/ccProduct/:bccpId",
+    name: "ccProductDetail",
+    component: () => import("@/views/ccProduct/Detail.vue"),
     meta: {
-      keepAlive: false
-    }
+      keepAlive: false,
+    },
   },
   {
-    path: '/jyycc',
-    name: 'JYYCC',
-    component: () => import('@/views/boutique/components/jyycc')
+    path: "/jyycc",
+    name: "JYYCC",
+    component: () => import("@/views/boutique/components/jyycc"),
   },
   {
-    path: '/sdcs',
-    name: 'SDCS',
-    component: () => import('@/views/boutique/components/SDCS')
+    path: "/sdcs",
+    name: "SDCS",
+    component: () => import("@/views/boutique/components/SDCS"),
   },
   {
-    path: '/jysg',
-    name: 'JYSG',
-    component: () => import('@/views/boutique/components/JYSG')
+    path: "/jysg",
+    name: "JYSG",
+    component: () => import("@/views/boutique/components/JYSG"),
+  },
+  {
+    path: "/zggzsgwdzjlz",
+    name: "zggzsgwdzjlz",
+    component: () =>
+      import("@/views/boutique/components/zggzsgwdzjlz/index.vue"),
   },
-
-
   // 404
   {
-    path: '*',
-    redirect: '/404',
-  }
-]
+    path: "*",
+    redirect: "/404",
+  },
+];
 /**
  * 解决重复点击同一个路由报错的问题
  */
 // 获取原型对象上的push函数
-const originalPush = VueRouter.prototype.push
+const originalPush = VueRouter.prototype.push;
 // 修改原型对象中的push方法
 VueRouter.prototype.push = function push(location) {
-  return originalPush.call(this, location).catch(err => err)
-}
+  return originalPush.call(this, location).catch((err) => err);
+};
 
 const router = new VueRouter({
   routes,
   scrollBehavior(to, from, savePosition) {
     // return 期望滚动到哪个的位置
     return {
-      y: 0
-    }
-  }
-})
+      y: 0,
+    };
+  },
+});
 
-export default router
+export default router;

src/views/boutique/components/jyycc.vue → src/views/boutique/components/jyycc/index.vue

@@ -628,9 +628,9 @@ export default {
             clear: both;
           }
           /* > img {
-            width: auto;
-            height: 100%;
-          } */
+              width: auto;
+              height: 100%;
+            } */
         }
       }
     }
@@ -721,9 +721,9 @@ export default {
               justify-content: center;
               .center-text {
                 /* font-size: 40px;
-                font-weight: 500;
-                color: #fff;
-                line-height: 50px; */
+                  font-weight: 500;
+                  color: #fff;
+                  line-height: 50px; */
                 width: 330px;
                 height: 50px;
                 margin-bottom: 30px;

src/views/boutique/components/lzsg/index.vue

+<template>
+    <div class="lzsg-show">
+        <!-- 第一部分 -->
+        <div>
+            <img src="" alt="">
+            <div class="img-top">
+                <img src="" alt="">
+            </div>
+            <div class="img-title">
+                <img src="" alt="">
+            </div>
+        </div>
+        <!-- 中间部分 -->
+        <div></div>
+        <!-- 第二部分 -->
+        <div></div>
+        <!-- 第三部分 -->
+        <div></div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {}
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/boutique/components/zggzsgwdzjlz/data.json

+[
+    {
+        "title": ["中共贵州省工作委员会的成立", "先进思想传贵州 红流滚滚播火种", "1919年5月 - 1935年1月"],
+        "txt": "五四运动前后，随着新文化运动的深入，马克思主义作为一种新思潮，在贵州知识界得以传播。1934年，外地一些共产党员先后来到贵州、转移至省城贵阳，以高家花园及其它数处为活动点，着手谋划与建立全省各地的党组织。1935年1月，中央红军长征抵达遵义，李维汉同志代表党中央批准成立中共贵州省工作委员会。",
+        "img": "book",
+        "label": ["国民党军用地图2张（复制品）"]
+    },
+    {
+        "title": ["党在贵州的早期斗争", "革命斗争堪险阻 血雨腥风铸英魂", "1935年1月 - 1937年7月"],
+        "txt": "中共贵州省工委成立后，遵照党中央的指示，在全省各地积极开展革命活动。在完成护送中央特派员杨涛(潘汉年)赴上海的任务 ;配合和支持红军在贵州的转战 ; 发展地方党组织; 建立军事领导小组，开展武装斗争等方面，建树了不可磨灭的功绩。",
+        "img": "paper",
+        "label": ["黄大陆在狱中写下的", "《移进油库 (地下室) 原因的检讨》（复制品）"]
+    },
+    {
+        "title": ["抗日战争时期贵州地方党组织的建立与发展", "抗日运动起高潮 党的组织蓬勃生", "1937年7月 - 1945年8月"],
+        "txt": "抗日战争爆发后，在中国抗日民族统一战线旗帜下，新建立的中共贵州省工委担负起领导和发动至省抗日救亡运动的重任。贵州抗日救亡运动如火如茶。",
+        "img": "gun",
+        "label": ["驳壳枪"]
+    },
+    {
+        "title": ["解放战争时期党组织在贵州的活动", "英勇斗争迎光明 万众欢腾庆解放", "1945年8月 - 1949年12月"],
+        "txt": "抗战胜利后，贵阳地区隐蔽下来的中共党员组织党小组，创办地下刊物，开展读书活动，发挥了积极的作用。1949年2月，中共中央上海局指示，建立中共贵州省工作委员会和中共贵阳特别支部，为迎接解放积极斗争。",
+        "img": "notice",
+        "label": ["《贵阳市民众临时治安委员会通告》（复制品）"]
+    }
+]
\ No newline at end of file

src/views/display/Detail.vue

@@ -48,6 +48,7 @@ export default {
       "displayType",
       "displayCharacter",
     ]);
+    debugger
     this.loadDetail();
   },
 

src/views/display/index.vue

@@ -222,7 +222,7 @@ export default {
       if (index == -1) {
         const { themeType, exhibitionId } = item;
         newPage = this.$router.resolve({
-          path: `display/${themeType}/${exhibitionId}`,
+          path: `/display/${themeType}/${exhibitionId}`,
         });
       } else {
         newPage = this.$router.resolve({