会员模块

pages/article/articleList/index.js

@@ -0,0 +1,92 @@
+ /*
+ * 手太欠
+ * 愿这世界都如故事里一样 美好而动人~
+ */
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        articlesArr : [] ,      //列表
+        page        : {},      //分页信息
+        type        : '',      //类型
+        name        : '',      //名称
+        lodingStats : false,  //加载状态
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        console.log(options)
+        this.setData({
+            type: options.type
+        })
+        if (options.type == '1') {
+            wx.setNavigationBarTitle({
+                title: '锶源昆仑·记忆'
+            })
+            this.setData({
+                name: 'memory'
+            })
+        } else if (options.type == '2') {
+            wx.setNavigationBarTitle({
+                title: '锶源昆仑·健康百科'
+            })
+            this.setData({
+                name: 'wiki'
+            })
+        }
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+        // 获取列表
+        this.articlesInfo();
+    },
+
+    // 列表
+    articlesInfo(page){
+        wx.$api.mall.articlesList({
+            category_id : this.data.type,
+            page : page || 1
+        }).then(res => {
+            let listArr = this.data.articlesArr,
+                newData = []
+            if(page == 1 || page == undefined) listArr = []
+            newData = listArr.concat(res.data.data)
+            this.setData({
+                articlesArr : newData,
+                page        : res.data.page,
+                lodingStats : false
+            })
+            wx.stopPullDownRefresh()
+        }).catch(err => {})
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+        // 获取列表
+		this.articlesInfo();
+    },
+
+    /**
+     * 上拉加载
+     */
+    onReachBottom(){
+        this.setData({
+            lodingStats: true
+        })
+        let pageNumber = this.data.page.current
+        if(this.data.page.has_more){
+            pageNumber++
+            // 获取列表
+		    this.articlesInfo(pageNumber);
+        }
+    }
+})

pages/article/articleList/index.json

@@ -0,0 +1,3 @@
+{
+    "usingComponents": {}
+}

pages/article/articleList/index.wxml

@@ -0,0 +1,25 @@
+<view class="list" wx:if="{{articlesArr.length > 0}}">
+    <navigator hover-class="none" url="../info/info?id={{item.article_id}}&type={{name}}" class="item" wx:for="{{articlesArr}}" wx:key="articlesArr">
+        <view class="itemCont">
+            <view class="nowrap itemCont-name"><text>{{item.categories[0].slug}}</text> | {{item.title}}</view>
+            <view class="nowrap itemCont-text">{{item.description}}</view>
+            <view class="itemCont-see">
+                <view class="itemCont-icon"><image src="https://api.siyuankunlun.com/storage/materials/2022/10/11/articleIcon_00.png"></image> {{item.clicks}}</view>
+                <view class="itemCont-icon"><image src="https://api.siyuankunlun.com/storage/materials/2022/10/11/articleIcon_01.png"></image>{{item.subscribes}}</view>
+            </view>
+        </view>
+        <image class="itemImg" mode="aspectFill" src="{{item.cover}}"></image>
+    </navigator>
+    <view class="pagesLoding" wx:if="{{lodingStats}}">
+        <block wx:if="{{page.has_more}}">
+            <image class="pagesLoding-icon" src="/static/icon/refresh_loding.gif" mode="widthFix"></image>加载中...
+        </block>
+        <block wx:else>
+            没有更多了~
+        </block>
+    </view>
+</view>
+<view class="pack-center pages-hint" wx:else>
+    <image src="/static/imgs/coupon_null.png"></image>
+    <view>暂无数据</view>
+</view>

pages/article/articleList/index.wxss

@@ -0,0 +1,66 @@
+page {
+    padding: 30rpx;
+    box-sizing: border-box;
+    background-color: #f6f6f6;
+}
+
+.item {
+    position: relative;
+    background-color: #ffffff;
+    border-radius: 10rpx;
+    height: 200rpx;
+    margin-bottom: 30rpx;
+}
+
+.itemImg {
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 200rpx;
+    height: 200rpx;
+    border-radius: 10rpx;
+    overflow: hidden;
+}
+
+.itemCont {
+    position: absolute;
+    left: 0;
+    top: 0;
+    padding: 25rpx 230rpx 0 30rpx;
+    box-sizing: border-box;
+    width: 100%;
+}
+
+.itemCont-name {
+    font-size: 30rpx;
+}
+
+.itemCont-name text {
+    text-transform: uppercase;
+}
+
+.itemCont-text {
+    color: #999;
+    font-size: 26rpx;
+    margin: 15rpx 0 30rpx;
+    font-weight: 200;
+}
+
+.itemCont-see {
+    color: #999;
+    display: flex;
+    font-size: 26rpx;
+    font-weight: 200;
+}
+
+.itemCont-icon {
+    display: flex;
+    margin-right: 50rpx;
+    line-height: 26rpx;
+}
+
+.itemCont-icon image {
+    width: 26rpx;
+    height: 26rpx;
+    margin-right: 10rpx;
+}