1、达人列表添加nav导航，返回按钮

2、达人页面猜你喜欢下边距50PX

1、达人列表添加nav导航，返回按钮
2、达人页面猜你喜欢下边距50PX
王强
1 parent 97954fdc
Showing 5 changed files with 157 additions and 97 deletions
src/components/backBox/backBox.less
src/pages/fansShopMessageList/fansShopMessageList.vue
src/pages/optimization/optimization.less
src/pages/optimization/optimization.vue
static/img/icon_back.png
@@ -32,7 +32,7 @@
 			justify-content: center;
 			align-items: center;
 			background-color: transparent;
-			color: #FFFFFF;
+			color: #333333;
 			font-size: 34px;
 			width: 60vw;
 			height: 93px;
@@ -54,4 +54,4 @@
 			}
 		}
 	}
-}
 \ No newline at end of file
+}
 <template>
-  <div>
-  <!--<div class="title">-->
-      <!--已关注达人-->
-  <!--</div>-->
-      <div class="item_box">
-      <ul
-          v-infinite-scroll="loadMore"
-          infinite-scroll-disabled="loading"
-          :infinite-scroll-distance="list.length">
-          <li v-for="(item, index) in list" :key="index" @click="$parent.toDetail(item)">
-              <dresserList
-                :dresserList="item">
-            </dresserList>
-          </li>
-      </ul>
-      </div>
-  </div>
+    <div>
+
+        <!-- nav -->
+        <back-box @back="back"
+            :backs="backs">
+        </back-box>
+
+        <!-- 已关注达人列表 -->
+        <div class="item_box">
+            <ul
+                v-infinite-scroll="loadMore"
+                infinite-scroll-disabled="loading"
+                :infinite-scroll-distance="list.length">
+                <li v-for="(item, index) in list" :key="index" @click="$parent.toDetail(item)">
+                    <dresserList
+                        :dresserList="item">
+                    </dresserList>
+                </li>
+            </ul>
+        </div>
+    </div>
 </template>
  
 <script>
     // 引入组件
     import { Toast, Indicator } from 'mint-ui';
+    import backBox from "@/components/backBox/backBox";
     import dresserList from "@/components/dresserList/dresserList";
  
-  export default {
-    name: 'fansShopMessageList',
-    data () {
-      return {
-          list: [],
-          loading: false,
-      }
-    },
-      components:{
-          dresserList
-      },
-    created(){
-        document.title = "已关注达人";
-        // 获取关注人列表
-        this.fansShopMessageList();
-    },
-    methods: {
-        /**
-         * 已关注达人列表
-         */
-        fansShopMessageList () {
-            // 加载中提示
-            Indicator.open('加载中...');
-            // 请求接口
-            this.http("/api/Dynamic/fansShopMessageList", {
-                uid:this.$route.query.uid
-            },this.fansShopMessageListCallback, {
-                method: "post"
-            });
+    export default {
+        name: 'fansShopMessageList',
+        data() {
+            return {
+                title: "",
+                backs: {
+                    title: "已关注达人",
+                    funcs: {
+                        back: {
+                            icon: "static/img/icon_back.png"
+                        }
+                    }
+                },
+                list: [],           // 达人列表
+                loading: false      // 上拉加载控制
+            }
         },
+        components: {
+            backBox,
+            dresserList
+        },
+        created() {
+
+            // 设置标题
+            this.$set(this, "title", "已关注达人");
+
+            // 获取关注人列表
+            this.fansShopMessageList();
+        },
+        methods: {
+
+            /**
+             * 已关注达人列表
+             */
+            fansShopMessageList () {
+
+                // 校验登录
+                if (this.$parent.checkLogin()) {
  
-        /**
-         * 已关注达人列表回调
-         * @param {object} res [服务器返回数据]
-         * @param {object} ext [扩展参数]
-         */
-        fansShopMessageListCallback(res, ext) {
-            // 加载完成
-            Indicator.close();
-            // 返回处理
-            if (res.code == 200) {
+                    // 加载中提示
+                    Indicator.open('加载中...');
  
-                // 解构数据
-                let {data: datas} = res;
+                    // 请求接口
+                    this.http("/api/Dynamic/fansShopMessageList", {
+                        uid: (this.$route.query.uid || this.getStore("uid"))
+                    },this.fansShopMessageListCallback, {
+                        method: "post"
+                    });
+                }
+            },
  
-                /*获取裂变数据*/
+            /**
+             * 已关注达人列表回调
+             * @param {object} res [服务器返回数据]
+             * @param {object} ext [扩展参数]
+             */
+            fansShopMessageListCallback(res, ext) {
+                // 加载完成
+                Indicator.close();
+                // 返回处理
+                if (res.code == 200) {
  
-                // 设置标题
-                this.$set(this, "list", datas.list);
+                    // 解构数据
+                    let {data: datas} = res;
+
+                    /*获取裂变数据*/
+
+                    // 设置标题
+                    this.$set(this, "list", datas.list);
+                }
+            },
+
+            /**
+             * 上拉加载
+             */
+            loadMore() {
+    //            this.loading = true;
+    //            setTimeout(() => {
+    //                let last = this.list[this.list.length - 1];
+    //                for (let i = 1; i <= 10; i++) {
+    //                    this.list.push(last + i);
+    //                }
+    //                this.loading = false;
+    //            }, 2500);
+            },
+
+            /**
+             * 后退
+             */
+            back() {
+
+                // 判断是否有后退函数
+                if (typeof this.$parent.back === "function") {
+
+                    // 调用后退
+                    this.$parent.back();
+                } else {
+
+                    // 后退
+                    window.history.go(-1);
+                }
             }
         },
-        loadMore() {
-//            this.loading = true;
-//            setTimeout(() => {
-//                let last = this.list[this.list.length - 1];
-//                for (let i = 1; i <= 10; i++) {
-//                    this.list.push(last + i);
-//                }
-//                this.loading = false;
-//            }, 2500);
+        head: {
+            title () {
+                return {
+                    inner: this.title
+                }
+            }
         },
+        watch: {
  
+            // 设置页面标题
+            title(newVal) {
+                if (this.$store.state.browser.toLowerCase() == "qq" && this.$store.state.deviceType.toLowerCase() == "iphone") {
+                    this.$iFrame.insertIFrame(newVal);
+                } else {
+                    this.$emit("updateHead");
+                }
+            }
+        }
     }
-  }
 </script>
  
 <!-- Add "scoped" attribute to limit CSS to this component only -->
@@ -8,7 +8,7 @@
         .components-box {
             margin-bottom: 50px;
             &:last-child {
-                margin-bottom: 0;
+                // margin-bottom: 0;
             }
         }
     }
@@ -89,10 +89,11 @@
  
     // 引入组件
     import { Toast, Indicator } from "mint-ui";
+    import dresserList from "@/components/dresserList/dresserList";
     import horizList from "@/components/horizList/horizList";
     import horizListFlex from "@/components/horizListFlex/horizListFlex";
     import textTitleBox from "@/components/textTitleBox/textTitleBox";
-    import dresserList from "@/components/dresserList/dresserList";
+
     export default {
         data () {
             return {
@@ -107,10 +108,10 @@
             }
         },
         components: {
+            dresserList,
             horizList,
             horizListFlex,
-            textTitleBox,
-            dresserList
+            textTitleBox
         },
         created() {
  
@@ -121,17 +122,7 @@
             this.fansShopMessageList();
         },
         methods: {
-            /**
-             * 跳转到关注人列表数据
-             */
-            h5More(){
-                this.$router.push({
-                    path:"/fansShopMessageList",
-                    query:{
-                        uid:this.$route.query.uid
-                    }
-                })
-            },
+
             /**
              * 优选页面接口
              */
@@ -174,7 +165,7 @@
                     // 获取“达人列表数据”
                     if (datas.list && datas.list.length) {
  
-                        // 设置“最近购买”数据
+                        // 设置“达人列表数据”数据
                         this.$set(this, "dresserList", datas.list);
                     }
  
@@ -234,6 +225,20 @@
             },
  
             /**
+             * 跳转到关注人列表数据
+             */
+            h5More() {
+
+                // 跳转达人列表页面
+                this.$router.push({
+                    path:"/fansShopMessageList",
+                    query:{
+                        uid: (this.$route.query.uid || this.getStore("uid"))
+                    }
+                })
+            },
+
+            /**
              * 跳转
              * @param {object} item [数据对象]
              */
@@ -269,11 +274,6 @@
              */
             more(item) {
  
-
-                console.log("more", item);
-
-
-
                 // 判断并调用通用跳转
                 if (typeof this.$parent.gotoDetail === "function") {
                     this.$parent.gotoDetail(item);
@@ -297,9 +297,6 @@
                     this.$emit("updateHead");
                 }
             }
-        },
-        mounted() {
-
         }
     }
 </script>