123

src/App.vue

@@ -135,6 +135,12 @@ export default {
   color: #e03723;
   border: 1px solid #e03723;
 }
+@media (max-width: 992px) {
+  .top{
+  width:100%;
+   height:47.8px
+}
+}
 </style>
 
 
@@ -162,6 +168,8 @@ p {
     sans-serif;
 }
 
+
+
 .coll {
   display: none;
 }
@@ -222,7 +230,10 @@ a:focus, a:hover {
 
 <style lang="less" scoped>
 @media (max-width: 992px) {
-  
+  .top{
+  width:100%;
+   height:47.8px
+}
  
  
   .main {

src/main.js

@@ -19,7 +19,7 @@ new Vue({
   //     return {x:0,y:0}
   //   }
   // },
-  
+ 
 
   render: h => h(App)
 }).$mount('#app')

src/router.js

@@ -1,6 +1,6 @@
 import Vue from 'vue'
 import Router from 'vue-router'
-import Home from './views/Home.vue'
+// import Home from './views/Home.vue'
 
 Vue.use(Router)
 
@@ -10,7 +10,7 @@ export default new Router({
     {
       path: '/',
       name: 'home',
-      component: Home
+      component: () => import(/* webpackChunkName: "home" */ './views/Home.vue')
     },
     {
       path: '/about',
@@ -34,7 +34,7 @@ export default new Router({
       // route level code-splitting
       // this generates a separate chunk (about.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
-      component: () => import(/* webpackChunkName: "Dynamic" */ './views/Dynamic.vue')
+      component: () => import(/* webpackChunkName: "dynamic" */ './views/Dynamic.vue')
     },
     {
       path: '/contact',
@@ -50,7 +50,7 @@ export default new Router({
       // route level code-splitting
       // this generates a separate chunk (about.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
-      component: () => import(/* webpackChunkName: "Details" */ './views/Details.vue')
+      component: () => import(/* webpackChunkName: "details" */ './views/Details.vue')
     },
     {
       path: '/business',
@@ -86,6 +86,10 @@ export default new Router({
     //   component: () => import(/* webpackChunkName: "wheelplantings" */ './components/wheelplantings.vue')
     // },
   ],
+  // scrollBehavior (to, from, savedPosition) {
+  //   return { x: 0, y: 0 }
+  // }
+  
   scrollBehavior (to, from, saveTop) {
     // return 期望滚动到哪个的位置
     if(saveTop){

src/views/Case.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="case">
     <Navbars></Navbars>
+    <div class="top"></div>
     <div>
       <img :src="cover.coverImg" width="100%" />
       <!-- width="100%" height="300"> -->
@@ -181,15 +182,6 @@ export default {
   min-height: 90vh;
 }
 
-/* .casecard {
-  width: 100%;
-
-  padding-bottom: 100%;
-  background-size: 100% 100% !important; */
-/* position: relative; */
-
-/* margin: 0;
-} */
 
 .border-bottom {
   /* display: none; */
@@ -231,12 +223,9 @@ export default {
 }
 
 @media (max-width: 992px) {
-  .case {
-    margin-top: 47.8px;
-    margin-bottom: -47.8px;
-    padding-bottom: 47.8px;
-    background-color: #fafafa;
-  }
+ .case{
+   background-color: #fafafa;
+ }
   .comtype {
     display: none;
     border-bottom: 1px solid #bfbfbf;

src/views/Details.vue

@@ -1,5 +1,6 @@
-<template>
+<template id="detail">
   <div class="details">
+    <div class="top"></div>
     <Navbars></Navbars>
     <div class="head">
       <img :src="current.caseDetailCoverImg" width="100%" />
@@ -99,32 +100,15 @@ export default {
       activeColor: '#000',
       isMobilePhone,
       date: moment().format('YYYY年MM月DD日 h:mm')
-      // config: {T00:00:00.000
-      //   // url: '', // 网址，默认使用 window.location.href
-      //   // source: '', // 来源（QQ空间会用到）, 默认读取head标签：<meta name="site" content="http://overtrue" />
-      //   // title: '', // 标题，默认读取 document.title 或者 <meta name="title" content="share.js" />
-      //   // description: '', // 描述, 默认读取head标签：<meta name="description" content="PHP弱类型的实现原理分析" />
-      //   image: '', // 图片, 默认取网页中第一个img标签
-      //   sites: ['weibo', 'wechat'], // 启用的站点
-      //   // disabled: ['google', 'facebook', 'twitter'], // 禁用的站点
-      //   wechatQrcodeTitle: '微信扫一扫：分享', // 微信二维码提示文字
-      //   wechatQrcodeHelper: '<p>微信里点“发现”，扫一下</p><p>二维码便可将本文分享至朋友圈。</p>'
-      // }
     }
-
   },
   components: {
     shares: () => import('../components/Shares'),
-
     Navbars: () => import('../components/Navbars'),
-
   },
   computed: {
-
-
     shareConfig () {
       return {
-
         url: window.location.href,
         title: this.current.caseTitle,
         image: this.current.caseDetailCoverImg, // 图片, 默认取网页中第一个img标签
@@ -184,6 +168,8 @@ export default {
         this.type = this.detail.current.type == 'case' ? '案例' : '分享'
         // console.log(this.detail.current, '1234')
         //  console.log(this.detail, '1234')
+        this.url=window.location.href
+        this.activeColor = '#000'
       })
     },
 
@@ -202,6 +188,7 @@ export default {
           }
         }
         this.activeColor = '#e03723'
+      
         // this.$message({
         //   message: res == this.current.likeNum ? '已赞' : '赞 +1',
         //   type: res == this.current.likeNum ? 'warning' : 'success'
@@ -344,9 +331,12 @@ export default {
 }
 
 @media (max-width: 992px) {
-  .details {
-    margin-top: 47.8px;
-  }
+  // .details {
+   
+  //   // margin-top: 47.8px;
+  //   // margin-bottom: -47.8px;
+  //   // padding-bottom: 47.8px;
+  // }
   .btn1 {
     line-height: 25px;
     font-size: 1.2rem !important;
@@ -398,7 +388,7 @@ export default {
     }
     .border-top {
       padding-top: 20px;
-
+margin-top: 2px;
       border-top: 1px solid #aaa;
     }
     .zan-share {

src/views/Dynamic.vue

@@ -1,5 +1,6 @@
 <template>
   <div class="dynamic">
+    <div class="top"></div>
     <Navbars></Navbars>
     <div>
       <img :src="cover.coverImg" width="100%" />
@@ -71,7 +72,6 @@ export default {
       cover: {},
       casetype: [],
       caselist: [],
-
       conditions: {
         pageNum: 0,
         pageSize: 8,
@@ -100,35 +100,22 @@ export default {
     }).then(data => {
       this.cover = data[0];
     })
-
-
-    // axios.get('http://localhost:8080/pc/dynamic/cover')
-
-    // 分类
-    // axios.get('http://localhost:8080/pc/dynamicType/list')
     request({
       ...apis.caseType.list,
     })
       .then(res => {
-
         this.casetype = (res.records || []).filter(x => x.type === 'movement');
-
       })
-
     this.getCaseList()
   },
-
   computed: {
-
   },
-
   methods: {
     getCaseList (filters = {}) {
       const params = {
         ...this.conditions,
         ...filters
       }
-
       return new Promise((resolve, reject) => {
         request({
           ...apis.case.list,
@@ -140,7 +127,6 @@ export default {
           } else {
             this.caselist = con.records;
           }
-
           this.conditions.pageNum = con.current
           this.allLoaded = con.current >= con.pages
           resolve(con)
@@ -150,24 +136,18 @@ export default {
         })
       })
     },
-
     more () {
       if (!this.allLoaded) {
         this.getCaseList({ pageNum: this.conditions.pageNum + 1 })
       }
     },
-
     filterCase (caseType) {
       this.currentTypeName = caseType ? caseType.typeName : '全部动态'
-
-
       this.getCaseList({ pageNum: 1, caseType: caseType ? caseType.id : '' });
       this.drawer = false;
       this.thisbtn = caseType ? caseType.typeName : ''
     },
   }
-
-
 }
 </script>
 
@@ -228,9 +208,9 @@ export default {
 
 @media (max-width: 992px) {
   .dynamic {
-    margin-top: 47.8px;
+    /* margin-top: 47.8px;
     margin-bottom: -47.8px;
-    padding-bottom: 47.8px;
+    padding-bottom: 47.8px; */
     background-color: #fafafa;
   }
   .comtype {