gdpaoup

pageB/details/index.vue

@@ -1,7 +1,7 @@
 <template>
     <view class="details">
         <view style="border-top: 1rpx solid #ececec;"></view>
-        <userinfo></userinfo>
+        <userinfo :list="userInfo"></userinfo>
         <view style="border-top: 20rpx solid #ececec;"></view>
         <u-tabs :is-scroll="false" bar-width="70" ref="tabs" :list="list" :current="num" :bar-style="{
                 'background-color':'#FF780F',
@@ -13,39 +13,15 @@
             }"
             :bold="false"
             @change="dianji"
-            :show-bar="false"></u-tabs>
-        <swiper class="card" @change="dianji" :current="num">
-            <swiper-item>
-                <scroll-view style="width:100%;height:100%" scroll-y="true">
-                    <view class="box">
-                        <view class="list">
-                            <view >
-                                <videoItem v-for="item in 10" :key="index"></videoItem>
-                            </view>
-                            <view style="margin-left:20rpx">
-                                <videoItem v-for="item in 10" :key="index"></videoItem>
-                            </view>
-                        </view>
-                    </view>
-                    
-                </scroll-view>
-            </swiper-item>
-            <swiper-item>
-                <scroll-view style="width:100%;height:100%" scroll-y="true">
-                    <view class="box">
-                        <view class="list">
-                            <view >
-                                <zhiboItem v-for="item in 10" :key="index"></zhiboItem>
-                            </view>
-                            <view style="margin-left:20rpx">
-                                <zhiboItem v-for="item in 10" :key="index"></zhiboItem>
-                            </view>
-                        </view>
-                    </view>
-                    
-                </scroll-view>
-            </swiper-item>
-        </swiper>
+            :show-bar="false">
+        </u-tabs>
+        <scroll-view class="scroll-box" scroll-y="true">
+            <view class="box">
+            	<videoItem v-for="item in listInfo" :key="item.article_id" :item="item"
+            	 @getArticlelist="getArticlelist"></videoItem>
+                 <view class="no-data" v-show="!listInfo && !page">暂无数据</view>
+            </view>
+        </scroll-view>
     </view>
 </template>
 <style lang="scss" scoped>
@@ -61,39 +37,85 @@
             display: flex;
         }
     }
+    .scroll-box {
+        // display: flex;
+        padding: 20rpx;
+        box-sizing: border-box;
+        .box {
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: space-between;
+            .no-data {
+                margin: 100rpx auto 0;
+            }
+        }
+    }
 }
 </style>
 <script>
-import videoItem from "@/components/index/video-item/index" 
-import zhiboItem from "@/components/index/zhibo-item/index" 
 import userinfo from "../components/details/userinfo"
+import videoItem from "@/components/index/video-item/index"
 export default {
-    name:"details",
+    // name:"details",
     components:{
        userinfo,
-       videoItem,
-       zhiboItem
+       videoItem
     },
     data(){
         return {
             list:[
                 {
-					name: '短视频'
-				}, {
 					name: '图文'
+				}, {
+					name: '短视频'
 				}
             ],
-            num:0
+            num: 0,
+            userInfo: {}, // 用户信息
+            listInfo: [], // 列表详情
+            member_id: 0,
+            page: 0,
         }
     },
+    onLoad(option) {
+        // console.log(option);
+        this.member_id = option.id;
+        this.getUserInfo(option.id);
+        this.getArticlelist();
+    },
     methods:{
+        // 获取信息
+        getUserInfo(id) {
+            this.$u.post("MemberExpert/expertInfo",{member_id: id}).then(res => {
+                // console.log(res);
+                this.userInfo = res.data.info;
+                // console.log(this.userInfo);
+            })
+        },
+        // 获取列表
+        getArticlelist() {
+            this.$u.api.getArticlelist({
+                page: this.page,
+                is_video_img: this.num + 1,
+                member_id: this.member_id,
+            }).then(res => {
+                if (res.errCode == 0) {
+                    // console.log(res);
+                    this.listInfo = res.data.list;
+                    console.log(this.listInfo);
+                } else {
+                    console.log(res.message);
+                }
+            })
+        },
         dianji(a){
-            console.log(a)
+            console.log(a);
             if(typeof a == "object"){
                 this.num = a.detail.current
             }else{
                 this.num = a
             }
+            this.getArticlelist();
         }
     }
 }