周立森 5 年前
父节点
当前提交
3b69963b05
共有 6 个文件被更改,包括 40 次插入66 次删除
  1. 12
    1
      src/App.vue
  2. 1
    1
      src/main.js
  3. 8
    4
      src/router.js
  4. 4
    15
      src/views/Case.vue
  5. 12
    22
      src/views/Details.vue
  6. 3
    23
      src/views/Dynamic.vue

+ 12
- 1
src/App.vue 查看文件

135
   color: #e03723;
135
   color: #e03723;
136
   border: 1px solid #e03723;
136
   border: 1px solid #e03723;
137
 }
137
 }
138
+@media (max-width: 992px) {
139
+  .top{
140
+  width:100%;
141
+   height:47.8px
142
+}
143
+}
138
 </style>
144
 </style>
139
 
145
 
140
 
146
 
162
     sans-serif;
168
     sans-serif;
163
 }
169
 }
164
 
170
 
171
+
172
+
165
 .coll {
173
 .coll {
166
   display: none;
174
   display: none;
167
 }
175
 }
222
 
230
 
223
 <style lang="less" scoped>
231
 <style lang="less" scoped>
224
 @media (max-width: 992px) {
232
 @media (max-width: 992px) {
225
-  
233
+  .top{
234
+  width:100%;
235
+   height:47.8px
236
+}
226
  
237
  
227
  
238
  
228
   .main {
239
   .main {

+ 1
- 1
src/main.js 查看文件

19
   //     return {x:0,y:0}
19
   //     return {x:0,y:0}
20
   //   }
20
   //   }
21
   // },
21
   // },
22
-  
22
+ 
23
 
23
 
24
   render: h => h(App)
24
   render: h => h(App)
25
 }).$mount('#app')
25
 }).$mount('#app')

+ 8
- 4
src/router.js 查看文件

1
 import Vue from 'vue'
1
 import Vue from 'vue'
2
 import Router from 'vue-router'
2
 import Router from 'vue-router'
3
-import Home from './views/Home.vue'
3
+// import Home from './views/Home.vue'
4
 
4
 
5
 Vue.use(Router)
5
 Vue.use(Router)
6
 
6
 
10
     {
10
     {
11
       path: '/',
11
       path: '/',
12
       name: 'home',
12
       name: 'home',
13
-      component: Home
13
+      component: () => import(/* webpackChunkName: "home" */ './views/Home.vue')
14
     },
14
     },
15
     {
15
     {
16
       path: '/about',
16
       path: '/about',
34
       // route level code-splitting
34
       // route level code-splitting
35
       // this generates a separate chunk (about.[hash].js) for this route
35
       // this generates a separate chunk (about.[hash].js) for this route
36
       // which is lazy-loaded when the route is visited.
36
       // which is lazy-loaded when the route is visited.
37
-      component: () => import(/* webpackChunkName: "Dynamic" */ './views/Dynamic.vue')
37
+      component: () => import(/* webpackChunkName: "dynamic" */ './views/Dynamic.vue')
38
     },
38
     },
39
     {
39
     {
40
       path: '/contact',
40
       path: '/contact',
50
       // route level code-splitting
50
       // route level code-splitting
51
       // this generates a separate chunk (about.[hash].js) for this route
51
       // this generates a separate chunk (about.[hash].js) for this route
52
       // which is lazy-loaded when the route is visited.
52
       // which is lazy-loaded when the route is visited.
53
-      component: () => import(/* webpackChunkName: "Details" */ './views/Details.vue')
53
+      component: () => import(/* webpackChunkName: "details" */ './views/Details.vue')
54
     },
54
     },
55
     {
55
     {
56
       path: '/business',
56
       path: '/business',
86
     //   component: () => import(/* webpackChunkName: "wheelplantings" */ './components/wheelplantings.vue')
86
     //   component: () => import(/* webpackChunkName: "wheelplantings" */ './components/wheelplantings.vue')
87
     // },
87
     // },
88
   ],
88
   ],
89
+  // scrollBehavior (to, from, savedPosition) {
90
+  //   return { x: 0, y: 0 }
91
+  // }
92
+  
89
   scrollBehavior (to, from, saveTop) {
93
   scrollBehavior (to, from, saveTop) {
90
     // return 期望滚动到哪个的位置
94
     // return 期望滚动到哪个的位置
91
     if(saveTop){
95
     if(saveTop){

+ 4
- 15
src/views/Case.vue 查看文件

1
 <template>
1
 <template>
2
   <div class="case">
2
   <div class="case">
3
     <Navbars></Navbars>
3
     <Navbars></Navbars>
4
+    <div class="top"></div>
4
     <div>
5
     <div>
5
       <img :src="cover.coverImg" width="100%" />
6
       <img :src="cover.coverImg" width="100%" />
6
       <!-- width="100%" height="300"> -->
7
       <!-- width="100%" height="300"> -->
181
   min-height: 90vh;
182
   min-height: 90vh;
182
 }
183
 }
183
 
184
 
184
-/* .casecard {
185
-  width: 100%;
186
-
187
-  padding-bottom: 100%;
188
-  background-size: 100% 100% !important; */
189
-/* position: relative; */
190
-
191
-/* margin: 0;
192
-} */
193
 
185
 
194
 .border-bottom {
186
 .border-bottom {
195
   /* display: none; */
187
   /* display: none; */
231
 }
223
 }
232
 
224
 
233
 @media (max-width: 992px) {
225
 @media (max-width: 992px) {
234
-  .case {
235
-    margin-top: 47.8px;
236
-    margin-bottom: -47.8px;
237
-    padding-bottom: 47.8px;
238
-    background-color: #fafafa;
239
-  }
226
+ .case{
227
+   background-color: #fafafa;
228
+ }
240
   .comtype {
229
   .comtype {
241
     display: none;
230
     display: none;
242
     border-bottom: 1px solid #bfbfbf;
231
     border-bottom: 1px solid #bfbfbf;

+ 12
- 22
src/views/Details.vue 查看文件

1
-<template>
1
+<template id="detail">
2
   <div class="details">
2
   <div class="details">
3
+    <div class="top"></div>
3
     <Navbars></Navbars>
4
     <Navbars></Navbars>
4
     <div class="head">
5
     <div class="head">
5
       <img :src="current.caseDetailCoverImg" width="100%" />
6
       <img :src="current.caseDetailCoverImg" width="100%" />
99
       activeColor: '#000',
100
       activeColor: '#000',
100
       isMobilePhone,
101
       isMobilePhone,
101
       date: moment().format('YYYY年MM月DD日 h:mm')
102
       date: moment().format('YYYY年MM月DD日 h:mm')
102
-      // config: {T00:00:00.000
103
-      //   // url: '', // 网址,默认使用 window.location.href
104
-      //   // source: '', // 来源(QQ空间会用到), 默认读取head标签:<meta name="site" content="http://overtrue" />
105
-      //   // title: '', // 标题,默认读取 document.title 或者 <meta name="title" content="share.js" />
106
-      //   // description: '', // 描述, 默认读取head标签:<meta name="description" content="PHP弱类型的实现原理分析" />
107
-      //   image: '', // 图片, 默认取网页中第一个img标签
108
-      //   sites: ['weibo', 'wechat'], // 启用的站点
109
-      //   // disabled: ['google', 'facebook', 'twitter'], // 禁用的站点
110
-      //   wechatQrcodeTitle: '微信扫一扫:分享', // 微信二维码提示文字
111
-      //   wechatQrcodeHelper: '<p>微信里点“发现”,扫一下</p><p>二维码便可将本文分享至朋友圈。</p>'
112
-      // }
113
     }
103
     }
114
-
115
   },
104
   },
116
   components: {
105
   components: {
117
     shares: () => import('../components/Shares'),
106
     shares: () => import('../components/Shares'),
118
-
119
     Navbars: () => import('../components/Navbars'),
107
     Navbars: () => import('../components/Navbars'),
120
-
121
   },
108
   },
122
   computed: {
109
   computed: {
123
-
124
-
125
     shareConfig () {
110
     shareConfig () {
126
       return {
111
       return {
127
-
128
         url: window.location.href,
112
         url: window.location.href,
129
         title: this.current.caseTitle,
113
         title: this.current.caseTitle,
130
         image: this.current.caseDetailCoverImg, // 图片, 默认取网页中第一个img标签
114
         image: this.current.caseDetailCoverImg, // 图片, 默认取网页中第一个img标签
184
         this.type = this.detail.current.type == 'case' ? '案例' : '分享'
168
         this.type = this.detail.current.type == 'case' ? '案例' : '分享'
185
         // console.log(this.detail.current, '1234')
169
         // console.log(this.detail.current, '1234')
186
         //  console.log(this.detail, '1234')
170
         //  console.log(this.detail, '1234')
171
+        this.url=window.location.href
172
+        this.activeColor = '#000'
187
       })
173
       })
188
     },
174
     },
189
 
175
 
202
           }
188
           }
203
         }
189
         }
204
         this.activeColor = '#e03723'
190
         this.activeColor = '#e03723'
191
+      
205
         // this.$message({
192
         // this.$message({
206
         //   message: res == this.current.likeNum ? '已赞' : '赞 +1',
193
         //   message: res == this.current.likeNum ? '已赞' : '赞 +1',
207
         //   type: res == this.current.likeNum ? 'warning' : 'success'
194
         //   type: res == this.current.likeNum ? 'warning' : 'success'
344
 }
331
 }
345
 
332
 
346
 @media (max-width: 992px) {
333
 @media (max-width: 992px) {
347
-  .details {
348
-    margin-top: 47.8px;
349
-  }
334
+  // .details {
335
+   
336
+  //   // margin-top: 47.8px;
337
+  //   // margin-bottom: -47.8px;
338
+  //   // padding-bottom: 47.8px;
339
+  // }
350
   .btn1 {
340
   .btn1 {
351
     line-height: 25px;
341
     line-height: 25px;
352
     font-size: 1.2rem !important;
342
     font-size: 1.2rem !important;
398
     }
388
     }
399
     .border-top {
389
     .border-top {
400
       padding-top: 20px;
390
       padding-top: 20px;
401
-
391
+margin-top: 2px;
402
       border-top: 1px solid #aaa;
392
       border-top: 1px solid #aaa;
403
     }
393
     }
404
     .zan-share {
394
     .zan-share {

+ 3
- 23
src/views/Dynamic.vue 查看文件

1
 <template>
1
 <template>
2
   <div class="dynamic">
2
   <div class="dynamic">
3
+    <div class="top"></div>
3
     <Navbars></Navbars>
4
     <Navbars></Navbars>
4
     <div>
5
     <div>
5
       <img :src="cover.coverImg" width="100%" />
6
       <img :src="cover.coverImg" width="100%" />
71
       cover: {},
72
       cover: {},
72
       casetype: [],
73
       casetype: [],
73
       caselist: [],
74
       caselist: [],
74
-
75
       conditions: {
75
       conditions: {
76
         pageNum: 0,
76
         pageNum: 0,
77
         pageSize: 8,
77
         pageSize: 8,
100
     }).then(data => {
100
     }).then(data => {
101
       this.cover = data[0];
101
       this.cover = data[0];
102
     })
102
     })
103
-
104
-
105
-    // axios.get('http://localhost:8080/pc/dynamic/cover')
106
-
107
-    // 分类
108
-    // axios.get('http://localhost:8080/pc/dynamicType/list')
109
     request({
103
     request({
110
       ...apis.caseType.list,
104
       ...apis.caseType.list,
111
     })
105
     })
112
       .then(res => {
106
       .then(res => {
113
-
114
         this.casetype = (res.records || []).filter(x => x.type === 'movement');
107
         this.casetype = (res.records || []).filter(x => x.type === 'movement');
115
-
116
       })
108
       })
117
-
118
     this.getCaseList()
109
     this.getCaseList()
119
   },
110
   },
120
-
121
   computed: {
111
   computed: {
122
-
123
   },
112
   },
124
-
125
   methods: {
113
   methods: {
126
     getCaseList (filters = {}) {
114
     getCaseList (filters = {}) {
127
       const params = {
115
       const params = {
128
         ...this.conditions,
116
         ...this.conditions,
129
         ...filters
117
         ...filters
130
       }
118
       }
131
-
132
       return new Promise((resolve, reject) => {
119
       return new Promise((resolve, reject) => {
133
         request({
120
         request({
134
           ...apis.case.list,
121
           ...apis.case.list,
140
           } else {
127
           } else {
141
             this.caselist = con.records;
128
             this.caselist = con.records;
142
           }
129
           }
143
-
144
           this.conditions.pageNum = con.current
130
           this.conditions.pageNum = con.current
145
           this.allLoaded = con.current >= con.pages
131
           this.allLoaded = con.current >= con.pages
146
           resolve(con)
132
           resolve(con)
150
         })
136
         })
151
       })
137
       })
152
     },
138
     },
153
-
154
     more () {
139
     more () {
155
       if (!this.allLoaded) {
140
       if (!this.allLoaded) {
156
         this.getCaseList({ pageNum: this.conditions.pageNum + 1 })
141
         this.getCaseList({ pageNum: this.conditions.pageNum + 1 })
157
       }
142
       }
158
     },
143
     },
159
-
160
     filterCase (caseType) {
144
     filterCase (caseType) {
161
       this.currentTypeName = caseType ? caseType.typeName : '全部动态'
145
       this.currentTypeName = caseType ? caseType.typeName : '全部动态'
162
-
163
-
164
       this.getCaseList({ pageNum: 1, caseType: caseType ? caseType.id : '' });
146
       this.getCaseList({ pageNum: 1, caseType: caseType ? caseType.id : '' });
165
       this.drawer = false;
147
       this.drawer = false;
166
       this.thisbtn = caseType ? caseType.typeName : ''
148
       this.thisbtn = caseType ? caseType.typeName : ''
167
     },
149
     },
168
   }
150
   }
169
-
170
-
171
 }
151
 }
172
 </script>
152
 </script>
173
 
153
 
228
 
208
 
229
 @media (max-width: 992px) {
209
 @media (max-width: 992px) {
230
   .dynamic {
210
   .dynamic {
231
-    margin-top: 47.8px;
211
+    /* margin-top: 47.8px;
232
     margin-bottom: -47.8px;
212
     margin-bottom: -47.8px;
233
-    padding-bottom: 47.8px;
213
+    padding-bottom: 47.8px; */
234
     background-color: #fafafa;
214
     background-color: #fafafa;
235
   }
215
   }
236
   .comtype {
216
   .comtype {