490 lines
11 KiB
Vue
490 lines
11 KiB
Vue
<template>
|
||
<view>
|
||
<view class="titleSearch">
|
||
<view class="searchName">抢任务</view>
|
||
|
||
<u-search @focus="goSeach" shape="round" :showAction="false"></u-search>
|
||
</view>
|
||
<view>
|
||
<view>任务</view>
|
||
<view>岗位</view>
|
||
<view>推荐</view>
|
||
</view>
|
||
|
||
|
||
<!-- 筛选 -->
|
||
<view class="screenButton" @click="showPopUp = true">
|
||
筛选
|
||
<view class="arrow-up-right"> </view>
|
||
</view>
|
||
<u-popup closeable :show="showPopUp" mode="right" @close="closePopUp" @open="openPopUp">
|
||
<view class="popUpWrapper">
|
||
<verticalMenu></verticalMenu>
|
||
</view>
|
||
</u-popup>
|
||
<!-- <v-tabs :tabs="['最新', '附近', '推荐']" height="45px" v-model="activeTab" color="#999" activeColor="#000"
|
||
fontSize="36rpx" activeFontSize="36rpx" @change='changeTab' />
|
||
<image src="../../static/img/search.svg" @click="goSeach" class="topseach" mode=""></image> -->
|
||
|
||
|
||
|
||
<block v-if="activeTab == 0">
|
||
<view v-if="newList.length > 0">
|
||
<block v-for="(item, index) in newList" :key="index">
|
||
<companyList :companyitem="item"></companyList>
|
||
<view class="baddd"></view>
|
||
</block>
|
||
</view>
|
||
<view v-else>
|
||
<image src="../../static/img/pic_notask.svg" class="nothing" mode=""></image>
|
||
<view class="nothing_text">暂无信息</view>
|
||
</view>
|
||
</block>
|
||
|
||
<block v-if="activeTab == 1">
|
||
<view>
|
||
<view class="baddd"></view>
|
||
<view class="location" @click="gomap">
|
||
<image src="../../static/img/location.svg" mode=""></image>
|
||
{{ currentAddress }}（切换位置）
|
||
<image src="../../static/img/right.svg" mode=""></image>
|
||
</view>
|
||
<view class="baddd"></view>
|
||
</view>
|
||
|
||
<view v-if="companyList.length > 0">
|
||
<block v-for="(item, index) in companyList" :key="item.id">
|
||
<companyList :companyitem="item" :near="activeTab === 0"></companyList>
|
||
<view class="baddd"></view>
|
||
</block>
|
||
</view>
|
||
<view v-else>
|
||
<image src="../../static/img/pic_notask.svg" mode="" class="nothing"></image>
|
||
<view class="nothingContnt">
|
||
暂无信息
|
||
</view>
|
||
</view>
|
||
</block>
|
||
|
||
<block v-if="activeTab == 2">
|
||
<view v-if="recommendList.length > 0">
|
||
<block v-for="(item, index) in recommendList" :key="item.id">
|
||
<companyList :companyitem="item"></companyList>
|
||
<view class="baddd"></view>
|
||
</block>
|
||
</view>
|
||
|
||
<view v-else>
|
||
<image src="../../static/img/pic_notask.svg" mode="" class="nothing"></image>
|
||
<view class="nothingContnt">
|
||
完善技能，获取精推荐
|
||
</view>
|
||
<view class="btn" @click="goResume">
|
||
完善技能
|
||
</view>
|
||
</view>
|
||
</block>
|
||
|
||
<cs-button></cs-button>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import vTabs from '@/components/v-tabs/v-tabs.vue';
|
||
import testData from '@/common/textdata.js';
|
||
import companyList from '@/components/companyList/companyList.vue';
|
||
import {
|
||
newMissionAll,
|
||
recommendMission,
|
||
nearMission
|
||
} from '@/api/mission.js';
|
||
import {
|
||
getcoder
|
||
} from "@/api/map.js";
|
||
import verticalMenu from '@/components/vertical-menu/vertical-menu.vue';
|
||
export default {
|
||
components: {
|
||
vTabs,
|
||
companyList, verticalMenu
|
||
},
|
||
data() {
|
||
return {
|
||
activeTab: 0,
|
||
companyList: [],
|
||
recommendList: [],
|
||
newList: [],
|
||
nearPage: {
|
||
current: 1,
|
||
size: 10,
|
||
total: 0
|
||
},
|
||
recommendPage: {
|
||
current: 1,
|
||
size: 10,
|
||
total: 0
|
||
},
|
||
newPage: {
|
||
current: 1,
|
||
size: 10,
|
||
total: 0
|
||
},
|
||
currentAddress: '',
|
||
currentPoint: {
|
||
latitude: 0,
|
||
longitude: 0
|
||
},
|
||
key: 'FW3BZ-6JTK6-GCUS5-MZCRR-3GPR5-HJFEI',
|
||
open: false,
|
||
showPopUp: false,
|
||
indexList: ["年龄", "学历", "工资"],
|
||
itemArr: [
|
||
['列表A1', '列表A2', '列表A3'],
|
||
['列表B1', '列表B2', '列表B3'],
|
||
['列表C1', '列表C2', '列表C3'],
|
||
]
|
||
}
|
||
},
|
||
onLoad: function () {
|
||
this.getData()
|
||
},
|
||
onShow: function () {
|
||
if (this.$store.state.user.token) {
|
||
this.$store.dispatch('refreshAuthState').then((e) => {
|
||
var auth = this.$store.state.auth
|
||
if (!auth.bankCardState) {
|
||
this.step()
|
||
}
|
||
})
|
||
}
|
||
|
||
const value = uni.getStorageSync('active');
|
||
if (value) {
|
||
this.activeTab = value;
|
||
uni.removeStorageSync('active')
|
||
}
|
||
},
|
||
/*页面滚动到底部 换页*/
|
||
onReachBottom: function () {
|
||
this.upLoad()
|
||
},
|
||
/*下拉刷新*/
|
||
onPullDownRefresh: function () {
|
||
if (!this.$store.state.user.token) {
|
||
uni.redirectTo({
|
||
url: "/pages/login/login"
|
||
});
|
||
} else {
|
||
this.download();
|
||
}
|
||
},
|
||
methods: {
|
||
step() {
|
||
var that = this
|
||
that.open = true
|
||
uni.showModal({
|
||
title: '实名认证',
|
||
content: `检查到您还未实名认证，实名认证之后才可进行操作哦`,
|
||
showCancel: false,
|
||
confirmText: '立即认证',
|
||
success: function (res) {
|
||
if (res.confirm) {
|
||
that.goSign(0)
|
||
} else if (res.cancel) {
|
||
that.step()
|
||
}
|
||
that.open = false
|
||
}
|
||
});
|
||
},
|
||
// 步骤
|
||
goSign(active) {
|
||
uni.navigateTo({
|
||
url: `/pages/projectInfo/signContract?active=${active}`
|
||
})
|
||
},
|
||
goResume: function () {
|
||
uni.navigateTo({
|
||
url: '/pageMy/my/resume/addSkill'
|
||
})
|
||
},
|
||
/*定位*/
|
||
getLocation: function () {
|
||
var that = this;
|
||
uni.getLocation({
|
||
type: 'gcj02',
|
||
success: function (res) {
|
||
that.currentPoint = {
|
||
latitude: res.latitude,
|
||
longitude: res.longitude
|
||
}
|
||
that.getAddrByPoint(res);
|
||
that.getNearList(that.currentPoint)
|
||
},
|
||
complete: function (e) { }
|
||
});
|
||
},
|
||
/*逆地址解析*/
|
||
getAddrByPoint: function (point) {
|
||
var that = this;
|
||
var location = point.latitude + ',' + point.longitude
|
||
getcoder(location, encodeURI(that.key), 0).then(res => {
|
||
that.currentAddress = res.data.result.address
|
||
});
|
||
},
|
||
goSeach: function () {
|
||
uni.navigateTo({
|
||
url: '../seach/seach'
|
||
})
|
||
},
|
||
gomap: function () {
|
||
uni.navigateTo({
|
||
url: '../mapSeach/mapSeach'
|
||
})
|
||
},
|
||
changeTab: function (e) {
|
||
this.activeTab = e;
|
||
},
|
||
//附近任务；
|
||
getNearList: function (point) {
|
||
nearMission(this.nearPage.current, this.nearPage.size, point.latitude, point.longitude, 50).then(res => {
|
||
if (this.nearPage.current === 1) {
|
||
this.companyList = [];
|
||
}
|
||
this.nearPage.current += 1;
|
||
this.nearPage.total = res.data.data.total;
|
||
if (res.data.data && res.data.data.records.length) {
|
||
this.companyList = this.companyList.concat(res.data.data.records);
|
||
}
|
||
})
|
||
},
|
||
//推荐任务；
|
||
getRecommendList: function () {
|
||
recommendMission(this.recommendPage.current, this.recommendPage.size, '').then(res => {
|
||
if (this.recommendPage.current === 1) {
|
||
this.recommendList = [];
|
||
}
|
||
this.recommendPage.current += 1;
|
||
this.recommendPage.total = res.data.data.total;
|
||
if (res.data.data && res.data.data.records.length) {
|
||
this.recommendList = this.recommendList.concat(res.data.data.records);
|
||
}
|
||
})
|
||
},
|
||
//最新任务；
|
||
getNewList: function () {
|
||
newMissionAll(this.newPage.current, this.newPage.size, '').then(res => {
|
||
if (this.newPage.current === 1) {
|
||
this.newList = [];
|
||
}
|
||
this.newPage.current += 1;
|
||
this.newPage.total = res.data.data.total;
|
||
if (res.data.data && res.data.data.records.length) {
|
||
this.newList = this.newList.concat(res.data.data.records);
|
||
}
|
||
})
|
||
},
|
||
//上拉加载
|
||
upLoad: function () {
|
||
if (this.activeTab === 0) {
|
||
if (this.nearPage.current <= Math.ceil(this.nearPage.total / this.nearPage.size)) {
|
||
this.getNearList(this.currentPoint);
|
||
} else {
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: '已经是最后一页',
|
||
})
|
||
}
|
||
return
|
||
}
|
||
if (this.activeTab === 1) {
|
||
if (this.recommendPage.current <= Math.ceil(this.recommendPage.total / this.recommendPage.size)) {
|
||
this.getRecommendList();
|
||
} else {
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: '已经是最后一页',
|
||
})
|
||
}
|
||
return
|
||
}
|
||
if (this.activeTab === 2) {
|
||
if (this.newPage.current <= Math.ceil(this.newPage.total / this.newPage.size)) {
|
||
this.getNewList();
|
||
} else {
|
||
uni.showToast({
|
||
icon: "none",
|
||
title: '已经是最后一页',
|
||
})
|
||
}
|
||
return
|
||
}
|
||
},
|
||
//下拉刷新
|
||
download: function () {
|
||
if (this.activeTab === 0) {
|
||
this.nearPage.current = 1;
|
||
this.getLocation();
|
||
setTimeout(function () {
|
||
uni.stopPullDownRefresh();
|
||
}, 1000);
|
||
return
|
||
}
|
||
if (this.activeTab === 1) {
|
||
this.recommendPage.current = 1;
|
||
this.getRecommendList();
|
||
setTimeout(function () {
|
||
uni.stopPullDownRefresh();
|
||
}, 1000);
|
||
return
|
||
}
|
||
if (this.activeTab === 2) {
|
||
this.newPage.current = 1;
|
||
this.getNewList();
|
||
setTimeout(function () {
|
||
uni.stopPullDownRefresh();
|
||
}, 1000);
|
||
return
|
||
}
|
||
},
|
||
getData: function () {
|
||
if (!this.$store.state.user.token) {
|
||
uni.redirectTo({
|
||
url: "/pages/login/login"
|
||
});
|
||
} else {
|
||
uni.$emit('newsReadChange');
|
||
this.nearPage.current = 1;
|
||
this.recommendPage.current = 1;
|
||
this.newPage.current = 1;
|
||
this.getLocation();
|
||
this.getRecommendList();
|
||
this.getNewList();
|
||
}
|
||
},
|
||
|
||
openPopUp() {
|
||
// console.log('open');
|
||
},
|
||
closePopUp() {
|
||
this.showPopUp = false
|
||
// console.log('close');
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
.titleSearch{
|
||
display: flex;
|
||
width: 80%;
|
||
margin: 0 auto;
|
||
font-size: 22px;
|
||
font-weight: bold;
|
||
padding: 10rpx;
|
||
|
||
}
|
||
.searchName{
|
||
margin-right: 15rpx;
|
||
}
|
||
|
||
.screenButton {
|
||
position: absolute;
|
||
top: 10px;
|
||
z-index: 1;
|
||
left: 30rpx;
|
||
/* border: 1px solid black; */
|
||
width: 50px;
|
||
text-align: center;
|
||
line-height: 30px;
|
||
font-size: 14px;
|
||
background-color: #f3f4f8;
|
||
}
|
||
|
||
.arrow-up-right {
|
||
width: 0;
|
||
height: 0;
|
||
border-left: 10px solid transparent;
|
||
border-right: 10px solid #949396;
|
||
/* 这里的颜色可以根据你的需要进行修改 */
|
||
border-bottom: 10px solid transparent;
|
||
position: absolute;
|
||
top: 3px;
|
||
right: 3px;
|
||
|
||
}
|
||
|
||
|
||
.topseach {
|
||
width: 25px;
|
||
height: 25px;
|
||
position: absolute;
|
||
top: 10px;
|
||
right: 30rpx;
|
||
}
|
||
|
||
.location image:last-child {
|
||
margin-left: auto;
|
||
}
|
||
|
||
.location image {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 10rpx;
|
||
}
|
||
|
||
.location {
|
||
padding: 20rpx 30rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
}
|
||
|
||
.btn {
|
||
margin: 0 auto;
|
||
color: #999;
|
||
border: 1rpx solid #999;
|
||
font-size: 28rpx;
|
||
height: 52rpx;
|
||
line-height: 52rpx;
|
||
text-align: center;
|
||
width: 180rpx;
|
||
border-radius: 5rpx;
|
||
margin-top: 30rpx;
|
||
}
|
||
|
||
.nothing_text {
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 28rpx;
|
||
color: #666666;
|
||
text-align: center;
|
||
}
|
||
|
||
.nothingContnt {
|
||
font-family: PingFangSC-Regular;
|
||
font-size: 28rpx;
|
||
color: #333333;
|
||
margin-top: 30rpx;
|
||
text-align: center;
|
||
}
|
||
|
||
.nothing {
|
||
width: 400rpx;
|
||
height: 200rpx;
|
||
display: block;
|
||
margin: 0 auto;
|
||
margin-top: 300rpx;
|
||
}
|
||
|
||
.baddd {
|
||
background: #f6f6f6;
|
||
height: 20rpx;
|
||
}
|
||
|
||
.popUpWrapper {
|
||
width: 100%;
|
||
}
|
||
</style>
|