存reportInfo

src/store/modules/home.ts

@@ -10,10 +10,46 @@ import {
 export default {
   namespaced: true,
   state: {
+    // 数据报告列表
+    reportList: sessionStorage.getItem('report-list') ? JSON.parse(sessionStorage.getItem('report-list') || '') : {
+      list: [],
+      loading: false,
+      finished: false,
+      currentPage: 1,
+      totalPage: 0,
+      scroll: 0
+    },
+    // 数据报告详情
+    reportInfo: sessionStorage.getItem('report-info') ? JSON.parse(sessionStorage.getItem('report-info') || '') : {
+      id: null,
+      before_price: 0,
+      price: 0,
+      pushtime: 0
+    },
     // 购买页面数据保存
     buyState: sessionStorage.getItem('activity-x-buyState') ? JSON.parse(sessionStorage.getItem('activity-x-buyState') || '') : {}
   },
   mutations: {
+    // 保存数据报告列表
+    saveReportList (state, data) {
+      for (const key in data) {
+        state.reportList[key] = data[key]
+      }
+      sessionStorage.setItem('report-list', JSON.stringify(data))
+    },
+    // 清除数据报告列表
+    clearReportList (state) {
+      state.reportList = {}
+      sessionStorage.setItem('report-list', JSON.stringify({}))
+    },
+    // 保存数据报告详情
+    saveReportInfo (state, data) {
+      for (const key in data) {
+        state.reportList[key] = data[key]
+      }
+      sessionStorage.setItem('report-info', JSON.stringify(data))
+    },
+    // 保存购买信息
     saveBuyState (state, data) {
       for (const key in data) {
         state.buyState[key] = data[key]

src/views/main/Home.vue

@@ -35,7 +35,7 @@
 </template>
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
-import { mapActions } from 'vuex'
+import { mapState, mapMutations, mapActions } from 'vuex'
 import { List } from 'vant'
 import Empty from '@/components/common/Empty.vue'
 @Component({
@@ -45,6 +45,12 @@ import Empty from '@/components/common/Empty.vue'
     Empty
   },
   methods: {
+    ...mapState('home', {
+      reportList: (state: any) => state.reportList
+    }),
+    ...mapMutations({
+      saveList: 'home/saveReportList'
+    }),
     ...mapActions({
       getList: 'home/getReportList'
     })
@@ -52,7 +58,9 @@ import Empty from '@/components/common/Empty.vue'
 })
 
 export default class Home extends Vue {
+  protected reportList!: any
   protected getList!: any
+  protected saveList!: any
   listState = {
     list: [],
     loading: false,
@@ -63,7 +71,6 @@ export default class Home extends Vue {
   }
 
   beforeRouteEnter (to, from, next) {
-    console.log(to, from)
     if (from.name === 'detail') {
       to.meta.isBack = true
     } else {
@@ -72,10 +79,6 @@ export default class Home extends Vue {
     next()
   }
 
-  created () {
-    // this.getReportList()
-  }
-
   activated () {
     if (!this.$route.meta.isBack) {
       this.listState = {
@@ -87,14 +90,18 @@ export default class Home extends Vue {
         scroll: 0
       }
       this.getReportList()
+      return
     }
     this.$route.meta.isBack = false
-    ;(this.$refs.wrapper as any).scrollTop = this.listState.scroll
+    this.listState = this.reportList()
+    this.$nextTick(() => {
+      ;(this.$refs.wrapper as any).scrollTop = this.reportList().scroll
+    })
   }
 
   beforeRouteLeave (to, form, next) {
-    console.log((this.$refs.wrapper as any).scrollTop)
     this.listState.scroll = (this.$refs.wrapper as any).scrollTop
+    this.saveList(this.listState)
     next()
   }
 

src/views/main/IntroducePage.vue

@@ -24,20 +24,28 @@
 
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
-// import { mapState, mapActions, mapMutations } from 'vuex'
+import { mapMutations } from 'vuex'
 
 @Component({
   name: 'introduce',
   methods: {
+    ...mapMutations({
+      clearReportList: 'home/clearReportList'
+    })
   }
 })
 
 export default class Introduce extends Vue {
+  protected clearReportList!: any
   list = [
     { src: require('../../assets/image/dujiafabu.png'), title: '独家发布', desc: '剑鱼标讯官方独家跟进剑鱼标讯数据，定期制作 高质量的行业数据报告' },
     { src: require('../../assets/image/hongguanjiaodu.png'), title: '宏观视角', desc: '剑鱼标讯参照政治、经济、文化等多角度宏观视角去分析行业特性和未来趋势' },
     { src: require('../../assets/image/shangjijiazhi.png'), title: '商机价值', desc: '通过剑鱼标讯数据报告分析，针对每个行业的独特视角，寻找适合企业发展的商机价值' }
   ]
+
+  mounted () {
+    this.clearReportList()
+  }
 }
 </script>
 

src/views/main/ReportDetail.vue

@@ -41,7 +41,7 @@
       </div>
       <div class="j-footer">
         <div class="j-button-group">
-            <button class="j-button-confirm" @click="$router.push('/buy')">立即购买</button>
+            <button class="j-button-confirm" @click="goBuy(detail.id)">立即购买</button>
         </div>
       </div>
     </div>
@@ -49,7 +49,7 @@
 </template>
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
-import { mapActions } from 'vuex'
+import { mapMutations, mapActions } from 'vuex'
 import { Skeleton } from 'vant'
 @Component({
   name: 'detail',
@@ -57,6 +57,9 @@ import { Skeleton } from 'vant'
     [Skeleton.name]: Skeleton
   },
   methods: {
+    ...mapMutations({
+      saveReportInfo: 'home/saveReportInfo'
+    }),
     ...mapActions({
       getDetail: 'home/getReportDetail'
     })
@@ -65,6 +68,7 @@ import { Skeleton } from 'vant'
 
 export default class Home extends Vue {
   protected getDetail!: any
+  protected saveReportInfo!: any
   skeletonShow = true
   detail = {
     id: 12,
@@ -84,6 +88,11 @@ export default class Home extends Vue {
       }
     })
   }
+
+  goBuy (id) {
+    this.saveReportInfo(this.detail)
+    this.$router.push(`/buy/${id}`)
+  }
 }
 </script>
 <style lang="scss">