mw_odd_job/app/mobile/view/resume/index.html

{extend name="public/base"/}
{block name="css"}
<style>
    .van-nav-bar__text, .van-nav-bar .van-icon{color:white;}
    .lw-list {display:flex;margin-top:10px;padding-bottom:10px;border-bottom:2px solid #f8f9fb;}
    .lw-list .avatar{width:45px;height:45px;}
    .lw-list .content {margin-left:10px;font-size:14px;}
    .lw-list .content .name{color:#e54d42;}
    .lw-list .content .tags .van-tag {margin-top:5px;margin-right:5px;}
    .box-border {border-bottom:1px solid #eee;padding-bottom:5px;}
    .plr-10 {padding-left:10px;padding-right:10px;}
</style>
{/block}
{block name="body"}
<van-nav-bar
        class="bg-blue"
        fixed="true"
>
    <template #title>
        <span class="text-white">简历</span>
    </template>
</van-nav-bar>
<div style="width:100%;height:46px;"></div>
<van-dropdown-menu>
    <van-dropdown-item v-model="form.jobintention" :options="userwill" @change="onSearch"></van-dropdown-item>
    <van-dropdown-item v-model="form.cateid" :options="catelist" @change="onSearch"></van-dropdown-item>
</van-dropdown-menu>
<van-pull-refresh v-model="refreshing" @refresh="onRefresh">
    <van-list
            v-model="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="onLoad"
    >
        <div class="job-box">
            <div class="job-item" v-for="item in list" style="padding: 15px 0 0 0;" @click="toResume(item.id)">
                <div class="lw-list plr-10">
                    <img :src="item.avatar ? item.avatar : '__MIMG__/default_avatar.jpg'" class="avatar">
                    <div class="content">
                        <div class="name">{{item.realname ? item.realname : item.nickname}}</div>
                        <div class="tags">
                            <van-tag type="primary" color="#0081ff" size="medium" v-for="tag in item.com_cate">{{tag}}</van-tag>
                        </div>
                    </div>
                </div>
                <div class="job-flex plr-10" style="height:40px;">
                    <div class="job-flex-left">
                        <span>{{item.jobintention_text}} ·</span>
                        <span>{{item.age?item.age+'岁':'年龄未知'}} ·</span>
                        <span>{{item.education_text || '学历未知'}} ·</span>
                        <span>{{item.worker_text || '经验未知'}}</span>
                    </div>
                    <div class="job-flex-right salary">浏览量：{{item.volume}}</div>
                </div>
            </div>
        </div>
    </van-list>
</van-pull-refresh>
<div style="width:100%;height:50px;"></div>
<van-tabbar v-model="active" active-color="#0081ff" @change="onTabChange">
    <van-tabbar-item icon="wap-home-o">首页</van-tabbar-item>
    <van-tabbar-item icon="description">简历</van-tabbar-item>
</van-tabbar>
{/block}
{block name="script"}
<script>
    new Vue({
        el: '#app',
        data() {
            return {
                active: 1,
                userwill: {$userwill},
                catelist: {$catelist},
                form: {
                    jobintention: 0,
                    cateid: 0,
                },

                list: [],
                page: 1,
                loading: false,
                finished: false,
                refreshing: false,
            };
        },
        methods: {
            onTabChange(index) {
                const url = ["{:url('/emp/index')}","{:url('/resume/index')}"];
                location.href = url[index];
            },
            onSearch() {
                this.onRefresh();
            },
            toResume(id) {
                location.href = "{:url('/resume/detail')}?id=" + id
            },
            //加载
            onLoad() {
                //参数
                let self = this;
                let param = this.form;
                param.page = this.page;
                this.page++;

                $.post("{:url('/resume/list')}", param, 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 = 1;
                this.loading = true;
                this.finished = false;

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