123

src/api/index.js

@@ -107,6 +107,9 @@ const getOrderCompare = (temple_id, type = '', goods_id = '', goods_type = '') =
 // 寺院列表
 const getTempleList = (keywords = '', lng = '', lat = '', page = 1, size = 10) => service.get(`/api/temple/get-List?keywords=${keywords}&lng=${lng}&lat=${lat}&page=${page}&size=${size}`)
 
+// 我的关注
+const getMyCollectionList = (page = 1, size = 10) => service.get(`/api/dynamic/get-collect-list?page=${page}&size=${size}`)
+
 export {
     getMonkAppellation,
     getRegion,
@@ -134,5 +137,6 @@ export {
     createMeritBoxOrder,
     getDynamicData,
     getCommonGoods,
-    getOrderCompare
+    getOrderCompare,
+    getMyCollectionList
 }

src/components/buddha-process/index.vue

@@ -11,7 +11,7 @@
         <div class="bar">
             <span class="join">已有{{privateData.sales}}人参与</span>
             <div class="btn-group">
-            <span class="btn" :class="[privateData.is_collected === 1 ? 'collect': 'un-collect']" @click.stop="onCollect">
+            <span class="btn" :class="[privateData.collect === 1 ? 'collect': 'un-collect']" @click.stop="onCollect">
                 <i class="iconfont icon-guanzhu-yiguanzhu"></i>
                 <b>关注</b>
             </span> 
@@ -48,7 +48,8 @@ export default {
       async onCollect(){
         const res = await toggleCollect(this.data.id);
         console.log(res)
-        this.privateData.is_collected = this.privateData.is_collected === 1 ? 0 : 1
+        this.privateData.is_collected = this.privateData.is_collected === 1 ? 0 : 1;
+        this.$emit('collection', this.data.id)
       },
       onProcessDetail(){
         const { goods_type, goods_id, temple_id } = this.privateData;

src/pages/user/focus/index.vue

@@ -4,43 +4,38 @@
             <van-nav-bar left-arrow v-if="$route.meta.showNavBar" :title="$route.meta.title" @click-left="$router.back()" :style="{backgroundColor: $route.meta.navBarBackgroundColor}" />
         </div>
         <div class="focus-list-container">
-            <buddha-process></buddha-process>
-            <buddha-process></buddha-process>
-            <buddha-process></buddha-process>
-            <buddha-process></buddha-process>
+            <div class="no-more" v-if="list.length === 0">暂无数据</div>
+            <buddha-process v-for="li in list" :key="li.id" :data="li" @collection="onCancelCollection"></buddha-process>
         </div>
     </div>
 </template>
 
 <script>
-import TMAPLoader from '@/common/tmap';
+import { getMyCollectionList } from '@/api'
 
 export default {
     data(){
         return {
             containerHeight: 0,
             keyword: '',
-            activeName: ''
+            activeName: '',
+            list: [],
+            page: 1,
         }
     },
     inject: ['root', 'tabbar'],
     mounted(){
-        this.$nextTick(() => {
-            const { offsetHeight } = this.root.$refs.tabbar.$el;
-            this.containerHeight = window.innerHeight - this.$refs.topbar.offsetHeight - offsetHeight - 20;
-        })
-        TMAPLoader.load({
-            key: process.env.VUE_APP_TMAP_KEY
-        }).then(TMap => {
-            console.log(TMap)
-            var center = new TMap.LatLng(39.984104, 116.307503);
-            //初始化地图
-            var map = new TMap.Map("container", {
-                zoom:12,//设置地图缩放级别
-                center: center//设置地图中心点坐标
-            });
-            console.log(map)
-        })
+        this.getMyCollectionList();
+    },
+    methods: {
+        async getMyCollectionList(){
+            const res = await getMyCollectionList(this.page)
+            this.list = this.list.concat(res.results);
+        },
+        onCancelCollection(id){
+            const index = this.list.map(item => item.id).indexOf(id);
+            this.list.splice(index, 1)
+        }
     }
 }
 </script>