<extend name="public@base"/>
<block name="css">
    <style>
    </style>
</block>
<block name="body">
    <van-nav-bar
            left-text="返回"
            left-arrow
            @click-left="onBack"
    >
        <template #title>
            <span>我的收藏</span>
        </template>
    </van-nav-bar>
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
        <van-list
                v-model="loading"
                :finished="finished"
                finished-text="没有更多了"
                @load="onLoad"
        >
            <div v-for="item in list">
                <dl>
                    <a class="block pr15 pt15 bg_f pr pl100" :href="'{:url('Userwall/detail')}?id=' + item.uid">
                        <dt class="avatar pa l15 t15">
                            <img class="img_60 br50" style="object-fit:cover;" :src="item.to_user.avatar ? item.to_user.avatar : '__TMPL__/public/assets/images/userwall/no_image_thumb.png'">
                        </dt>
                        <dd class="pb15 bo_bf7">
                            <div class="name fz16 pb5">
                                <van-icon
                                        :class="[item.to_user.sex == 1 ? 'icon-xingbie-nan text-blue' : 'icon-xingbie-nv text-pink','iconfont']"></van-icon>
                                {{item.to_user.username}}
                            </div>
                            <div class="user_info mt5 fz13 color_6">
                                <span>{{item.to_user.age}}岁</span>
                                <span>{{item.to_user.education}}</span>
                                <span>{{item.to_user.high}}CM</span>
                            </div>
                            <div class="text fz12 mt10 color_9 ws">{{item.to_user.signature}}</div>
                            <div class="time pa t15 r15 color_m fz12">{{item.create_time}}</div>
                        </dd>
                    </a>
                </dl>
            </div>
        </van-list>
    </van-pull-refresh>
</block>
<block name="script">
    <script>
        new Vue({
            el: '#app',
            data() {
                return {
                    active: 0,
                    list: {$list},
                    page: 1,
                    loading: false,
                    finished: false,
                    refreshing: false,
                };
            },
            methods: {
                onBack() {
                    history.back();
                },
                //加载
                onLoad() {
                    //参数
                    let self = this;
                    this.page++;

                    $.post("{:url('starList')}",{page:this.page}, function (json) {

                        //下拉刷新
                        if (self.refreshing) {
                            self.refreshing = false;
                        }

                        // 加载状态结束
                        self.loading = false;

                        if (json.data.length == 0) {
                            // 数据全部加载完成
                            self.finished = true;
                        } else {
                            // 增加数据
                            for (let i = 0; i < json.data.length; i++) {
                                self.list.push(json.data[i]);
                            }
                        }
                    }, 'json');
                },
                onRefresh() {
                    // 清空列表数据
                    this.list = [];
                    this.page = 0;
                    this.loading = true;
                    this.finished = false;

                    this.onLoad();
                },
            },
        });
    </script>
</block>