123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151 |
- <!doctype html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>我的招聘</title>
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
- <link href="../../css/mui.min.css" rel="stylesheet" />
- <link href="../../css/menu.min.css" rel="stylesheet" />
- <style>
- .top{position: fixed;width: 100%;z-index: 666;top:-1px ; background-color: white;overflow: hidden;box-shadow: 0 1px 6px #ccc;}
- .ui.secondary.pointing.menu{overflow:auto;border-bottom:0px;margin-top: 65px;}
- .ui.secondary.pointing.menu::-webkit-scrollbar {display:none}
- .main{margin-top: 115px;background-color: white;}
- .items{padding: 15px;font-size: 15px;color: #3a3939;border-bottom: 1px solid #efefef;}
- .items:last-child{border: 0px;}
- .cn{font-size: 10px;color: darkgray;padding-top: 3px;}
- .dc{}
- .isTop{color: red;font-weight: bold;}
- .icon{font-size: 48px;display: block;}
- .no_data{line-height:20px;}
- .dd{padding-left: 20px;}
- .sps{background: #00B5AD;padding: 1px 6px;border-radius: 3px;color: white;text-align: center;margin-left: 20px;}
- .lyy{float: right;margin-top: -20px;font-size: 15px;color: orange;}
- [v-cloak] {display: none;}
- </style>
- </head>
- <body>
- <div id="app" v-cloak>
- <div class="mui-content">
- <div class="top">
- <header class="mui-bar mui-bar-nav">
- <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
- <h1 class="mui-title">我的招聘</h1>
- </header>
- <div class="ui secondary pointing menu">
- <a class="item"
- :style="{'color':index==current?'#00a0ea':'','border-bottom':index==current?'4px solid #00a0ea':''}"
- v-for="(item,index) in column_list"
- @click="selected(param.columnId=item.id,current=index)">{{item.mColumnName}} </a>
- </div>
- </div>
- <div class="main" v-if="news_list.length>0">
- <div class="items" v-for="(item,index) in news_list" @click="detail(item.id)">
- <div class="omit">{{item.parttime_title}}</div>
- <div class="cn">
- <span class="isTop" v-show="item.isTop==1">置顶</span>
- <span class="dc"> {{item.work_region}}</span>
- <span class="dc"> {{item.parttime_date}}</span>
- <span class="dd">{{item.address}}</span>
- <span class="sps">{{item.yname}}</span>
- <div class="lyy">待录用</div>
- </div>
- </div>
- </div>
- <div class="no_data" v-else>
- <i class="icon icon-48"></i><br />没有数据
- </div>
- <!--加载更多-->
- <div class="more">
- <div class="loading" v-if="loading">
- <span class="mui-spinner"></span>
- <div class="mc">加载中...</div>
- </div>
- </div>
- </div>
- </div>
- <script src="../../js/mui.min.js"></script>
- <script src="../../js/app.js"></script>
- <script src="../../js/vue.min.js"></script>
- <script type="text/javascript">
- var vm = new Vue({
- el: "#app",
- data: {
- news_list: [],
- column_list: [{
- mColumnName: '已报名',
- id: 0
- }, {
- mColumnName: '已签合同',
- id: 1
- }, {
- mColumnName: '已结算',
- id: 2
- }, {
- mColumnName: '已评价',
- id: 3
- }],
- param: {
- page: 1,
- id: getUser().id
- },
- current: 0,
- loading: false,
- hasMore: false,
- },
- mounted: function() {
- this.getData();
- //监听滚动加载
- window.addEventListener('scroll', function() {
- //滚动高度+内高度>=文档高度
- if (document.body.scrollTop + window.innerHeight + 20 >= document.body
- .offsetHeight) {
- if (vm.hasMore) {
- vm.loading = true;
- //避免重复加载
- vm.hasMore = false;
- vm.param.page++;
- setTimeout(function() {
- vm.getData()
- }, 1000);
- }
- }
- })
- },
- methods: {
- //获取数据
- getData: function() {
- request(urls().myparttime_rec_List, this.param, function(res) {
- res.list.forEach(function(item) {
- vm.news_list.push(item);
- });
- vm.hasMore = vm.param.page < res.total ? true : false;
- vm.loading = false;
- plus.nativeUI.closeWaiting();
- })
- },
- //选择栏目
- selected: function(columnId, index) {
- vm.refresh();
- },
- //详情
- detail: function(id) {
- open('detail', 'detail.html', {
- id: id
- }, 'slide-in-bottom');
- },
- //刷新
- refresh: function() {
- vm.news_list = [];
- vm.param.page = 1;
- vm.getData();
- }
- }
- })
- </script>
- </body>
- </html>
|