350 lines
11 KiB
Plaintext
350 lines
11 KiB
Plaintext
<style lang="less" scoped>
|
|
@import url(../../styles/theme.less);
|
|
page {
|
|
background-color: #ffffff;
|
|
}
|
|
.returnIcon{
|
|
width: 14rpx;
|
|
height: 28rpx;
|
|
margin-left: 30rpx;
|
|
margin-right: 22rpx;
|
|
vertical-align: middle;
|
|
margin-top: -6rpx;
|
|
}
|
|
.titleContent{
|
|
position: absolute;
|
|
text-align: center;
|
|
width: calc(100% - 340rpx);
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
top: 0;
|
|
margin: auto;
|
|
height: 60rpx;
|
|
font-size: 32rpx;
|
|
line-height: 60rpx;
|
|
cursor: none;
|
|
pointer-events: none;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.certification{
|
|
margin-top: 36rpx;
|
|
margin-left: 30rpx;
|
|
margin-right: 30rpx;
|
|
height: 42rpx;
|
|
font-size: 30rpx;
|
|
font-weight: bold;
|
|
color: #333333;
|
|
line-height: 42rpx;
|
|
}
|
|
.select-big-box{
|
|
margin-top: 24rpx;
|
|
margin-left: 30rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
.select-box{
|
|
margin-right: 30rpx;
|
|
padding: 0 20rpx;
|
|
height: 56rpx;
|
|
line-height: 56rpx;
|
|
background: #F8F8F8;
|
|
color: #999999;
|
|
border-radius: 28rpx;
|
|
}
|
|
.true-select-box{
|
|
background-color: #FFF4F7;
|
|
color:#F33B6C;
|
|
}
|
|
}
|
|
.vertical-box{
|
|
margin-top: 36rpx;
|
|
margin-left: 30rpx;
|
|
margin-right: 30rpx;
|
|
height: 2rpx;
|
|
background: #F8F8F8;
|
|
}
|
|
.mainBtn{
|
|
width: 100vw;
|
|
height: 240rpx;
|
|
position: relative;
|
|
position: fixed;
|
|
bottom: 32rpx;
|
|
z-index: 9999;
|
|
.blurBox {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
background: white;
|
|
filter: blur(20rpx) contrast(1.2);
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.btn-box{
|
|
width: 520rpx;
|
|
height: 80rpx;
|
|
background: linear-gradient(270deg, #FF85A5 0%, #FF5380 100%);
|
|
border-radius: 100rpx;
|
|
}
|
|
}
|
|
.cuIcon-right {
|
|
margin-left: 16rpx;
|
|
}
|
|
</style>
|
|
<template>
|
|
<view class="ui-searchCondition">
|
|
<view class="cu-custom">
|
|
<view class="cu-bar fixed" :style="{height: CustomBar + 'px', paddingTop: StatusBar + 'px',zIndex: 999}">
|
|
<view @tap="handleBack">
|
|
<image class="returnIcon" src="https://images.ufutx.com/202104/09/91c42ff8b2da0c0ac0576fbc4dc163f6.png" mode="widthFix"></image>
|
|
<text class="font_28">返回</text>
|
|
</view>
|
|
<view class="titleContent bold" :style="{top: StatusBar + 'px'}">筛选</view>
|
|
</view>
|
|
</view>
|
|
<view :style="{height: navHeight + 'px'}"></view>
|
|
<view>
|
|
<view class="certification">实名认证</view>
|
|
<view class="select-big-box">
|
|
<view class="select-box {{realNameIndex == '0' ? 'true-select-box' : ''}}" @tap="changeSelect('0','0','未认证')">未认证</view>
|
|
<view class="select-box {{realNameIndex == '1' ? 'true-select-box' : ''}}" @tap="changeSelect('0','1','已认证')">已认证</view>
|
|
<view class="select-box {{realNameIndex == '2' ? 'true-select-box' : ''}}" @tap="changeSelect('0','2','')">不限</view>
|
|
</view>
|
|
<view class="vertical-box"></view>
|
|
<view class="certification">VIP会员</view>
|
|
<view class="select-big-box">
|
|
<view class="select-box {{vipIndex == '0' ? 'true-select-box' : ''}}" @tap="changeSelect('1','0','超级VIP')">超级VIP</view>
|
|
<view class="select-box {{vipIndex == '1' ? 'true-select-box' : ''}}" @tap="changeSelect('1','1','普通VIP')">普通VIP</view>
|
|
<view class="select-box {{vipIndex == '2' ? 'true-select-box' : ''}}" @tap="changeSelect('1','2','')">不限</view>
|
|
</view>
|
|
<view class="vertical-box"></view>
|
|
<view class="certification">学历</view>
|
|
<view class="select-big-box">
|
|
<view class="select-box {{educateIndex == '0' ? 'true-select-box' : ''}}" @tap="changeSelect('2','0','硕士以上')">硕士以上</view>
|
|
<view class="select-box {{educateIndex == '1' ? 'true-select-box' : ''}}" @tap="changeSelect('2','1','本科以上')">本科以上</view>
|
|
<view class="select-box {{educateIndex == '2' ? 'true-select-box' : ''}}" @tap="changeSelect('2','2','专科以上')">专科以上</view>
|
|
<view class="select-box {{educateIndex == '3' ? 'true-select-box' : ''}}" @tap="changeSelect('2','3','')">不限</view>
|
|
</view>
|
|
<view class="vertical-box"></view>
|
|
</view>
|
|
<view>
|
|
<view class="u_section certification">
|
|
<picker :value="beliefIndex" range="{{belief}}" bindchange="beliefChange">
|
|
<view class="m_secLst f-fbc">
|
|
<span class="font_28 color-333 bold">信仰</span>
|
|
<view class="font_28 f-fc">
|
|
<span class="color333" v-if="beliefIndex > -1">{{belief[beliefIndex]}}</span>
|
|
<span v-else class="color999">不限</span>
|
|
<text class="cuIcon-right lg text-gray"></text>
|
|
</view>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
<view class="vertical-box"></view>
|
|
<view class="u_section certification">
|
|
<picker mode="multiSelector" @change="bindMultiPickerChange" @columnchange="bindMultiPickerColumnChange" :value="multiIndex" range="{{objectMultiArray}}" >
|
|
<view class="m_secLst f-fbc">
|
|
<span class="font_28 color-333 bold">职业</span>
|
|
<view class="font_28 f-fc">
|
|
<span class="color333" v-if="industry && industry !== '不限'">{{industry}} / {{industry_sub}}</span>
|
|
<span v-else-if="industry === '不限'" class="color333">不限</span>
|
|
<span v-else class="color999">不限</span>
|
|
<text class="cuIcon-right lg text-gray"></text>
|
|
</view>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
<view class="vertical-box"></view>
|
|
<view class="u_section certification" >
|
|
<picker value="{{incomeIndex}}" range="{{incomeList}}" bindchange="incomeChange">
|
|
<view class="m_secLst f-fbc">
|
|
<span class="font_28 color-333 bold">年收入</span>
|
|
<view class="font_28 f-fc">
|
|
<span class="color333" v-if="incomeIndex > -1">{{incomeList[incomeIndex]}}</span>
|
|
<span v-else class="color999">不限</span>
|
|
<text class="cuIcon-right lg text-gray"></text>
|
|
</view>
|
|
</view>
|
|
</picker>
|
|
</view>
|
|
<view class="vertical-box"></view>
|
|
</view>
|
|
<view class="mainBtn f-fcc">
|
|
<button class="btn font_30 btn-box white radius shadow bg-blue margin-top f-fcc" @tap="handleBack">保存</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import wepy from '@wepy/core'
|
|
import https from '../../mixins/https'
|
|
import base from '../../mixins/base'
|
|
import {service} from '../../config'
|
|
|
|
wepy.page({
|
|
config: {},
|
|
mixins: [https, base],
|
|
|
|
data: {
|
|
inputVal: '', // 上个页面搜索框内容
|
|
realNameIndex: '2', // 实名认证判断
|
|
realNameList: ['未认证', '已认证', '不限'], // 实名认证判断
|
|
is_approved: '', // 实名认证
|
|
vipIndex: '2', // vip判断
|
|
is_rank: '', // vip
|
|
is_rank_list: ['超级VIP', '普通VIP', '不限'], // vip
|
|
educateIndex: '3', // 学历判断
|
|
degree: '', // 学历
|
|
degreeList: ['硕士以上', '本科以上', '专科以上', '不限'], // 学历
|
|
belief: ['不限', '基督教', '佛教', '伊斯兰教', '其他'],
|
|
beliefIndex: -1,
|
|
industry: '',
|
|
industry_sub: '',
|
|
Business: [],
|
|
multiIndex: [0, 0],
|
|
objectMultiArray: [],
|
|
incomeList: ['不限', '5w以下', '5~10w', '10~15w', '15~30w', '30~50w', '50~100w', '100~500w', '500w以上'],
|
|
incomeIndex: -1,
|
|
|
|
sexIndex: '',
|
|
ageIndex: '',
|
|
region: '',
|
|
|
|
navHeight: 0,
|
|
StatusBar: 0,
|
|
CustomBar: 0,
|
|
Custom: 0
|
|
},
|
|
methods: {
|
|
// 获取行业数据
|
|
getIndustry() {
|
|
let vm = this
|
|
vm.$get({url: `${service.host}/industry/json`}).then(({code, data}) => {
|
|
if (code === 0) {
|
|
vm.Business = data
|
|
vm.Business.unshift({title: '不限', items: ['不限']})
|
|
let IndustryArr = []
|
|
data.forEach(function (item, index, arr) {
|
|
IndustryArr.push(arr[index].title)
|
|
})
|
|
vm.objectMultiArray.push(IndustryArr)
|
|
vm.objectMultiArray.push(vm.Business[vm.multiIndex[0]].items)
|
|
}
|
|
wx.hideLoading()
|
|
}).catch(err => {
|
|
wx.hideLoading()
|
|
console.log(err)
|
|
})
|
|
},
|
|
// 选中的实名认证、VIP会员、学历
|
|
changeSelect(type, index, value) {
|
|
let vm = this
|
|
if (type === '0') {
|
|
vm.realNameIndex = index
|
|
vm.is_approved = value
|
|
} else if (type === '1') {
|
|
vm.vipIndex = index
|
|
vm.is_rank = value
|
|
} else if (type === '2') {
|
|
vm.educateIndex = index
|
|
vm.degree = value
|
|
}
|
|
},
|
|
// 选中的信仰
|
|
beliefChange(e) {
|
|
let vm = this
|
|
vm.beliefIndex = e.$wx.detail.value
|
|
},
|
|
// 选中的行业
|
|
bindMultiPickerChange(e) {
|
|
let vm = this
|
|
vm.multiIndex = e.$wx.detail.value
|
|
vm.industry = vm.objectMultiArray[0][e.$wx.detail.value[0]]
|
|
vm.industry_sub = vm.objectMultiArray[1][e.$wx.detail.value[1]]
|
|
},
|
|
bindMultiPickerColumnChange(e) {
|
|
let vm = this
|
|
vm.show = false
|
|
vm.multiIndex[e.$wx.detail.column] = e.$wx.detail.value
|
|
for (let i = 0; i < vm.Business.length; i++) {
|
|
if (vm.multiIndex[0] === i) {
|
|
vm.objectMultiArray = [vm.objectMultiArray[0], vm.Business[i].items]
|
|
}
|
|
}
|
|
},
|
|
// 选中的年收入
|
|
incomeChange(e) {
|
|
let vm = this
|
|
vm.incomeIndex = e.$wx.detail.value
|
|
},
|
|
// 返回搜索页
|
|
handleBack() {
|
|
let vm = this
|
|
let data = {
|
|
inputVal: vm.inputVal, // 上个页面搜索框内容
|
|
is_approved: vm.realNameList[parseInt(vm.realNameIndex)], // 实名认证
|
|
realNameIndex: vm.realNameIndex, // 实名认证
|
|
is_rank: vm.is_rank_list[parseInt(vm.vipIndex)], // vip会员
|
|
vipIndex: vm.vipIndex, // vip会员下标
|
|
degree: vm.degreeList[parseInt(vm.educateIndex)], // 学历
|
|
educateIndex: vm.educateIndex, // 学历下标
|
|
belief: vm.belief[vm.beliefIndex], // 信仰
|
|
beliefIndex: vm.beliefIndex, // 信仰下标
|
|
industry: vm.industry, // 职业
|
|
industry_sub: vm.industry_sub, // 副职业
|
|
multiIndex: vm.multiIndex, // 职业下标
|
|
income: vm.incomeList[vm.incomeIndex], // 年收入
|
|
incomeIndex: vm.incomeIndex, // 年收入下标
|
|
|
|
sexIndex: vm.sexIndex, // 性别下标
|
|
ageIndex: vm.ageIndex, // 年龄下标
|
|
region: vm.region // 城市
|
|
}
|
|
console.log(data, 'data-------------33---------------')
|
|
vm.$redirectTo(`/pages/home/searchUsers?params=${JSON.stringify(data)}`)
|
|
}
|
|
},
|
|
onShow() {
|
|
let vm = this
|
|
let app = vm.$app.$options
|
|
vm.navHeight = app.globalData.navBarHeight
|
|
vm.StatusBar = app.globalData.StatusBar
|
|
vm.CustomBar = app.globalData.CustomBar
|
|
vm.Custom = app.globalData.Custom
|
|
},
|
|
onLoad(e) {
|
|
let vm = this
|
|
if (e.params) {
|
|
let params = JSON.parse(e.params)
|
|
vm.inputVal = params.inputVal
|
|
vm.realNameIndex = params.realNameIndex
|
|
vm.vipIndex = params.vipIndex
|
|
vm.educateIndex = params.educateIndex
|
|
vm.beliefIndex = params.beliefIndex ? parseInt(params.beliefIndex) : -1
|
|
vm.industry = params.industry
|
|
vm.industry_sub = params.industry_sub
|
|
vm.incomeIndex = params.incomeIndex ? parseInt(params.incomeIndex) : -1
|
|
vm.multiIndex = params.multiIndex
|
|
|
|
vm.sexIndex = params.sexIndex
|
|
vm.ageIndex = params.ageIndex
|
|
vm.region = params.region
|
|
}
|
|
vm.getIndustry()
|
|
}
|
|
})
|
|
</script>
|
|
<config>
|
|
{
|
|
navigationBarTitleText: '筛选',
|
|
navigationStyle: 'custom',
|
|
enablePullDownRefresh: false,
|
|
backgroundColorTop: '#ffffff',
|
|
backgroundColorBottom: '#ffffff',
|
|
usingComponents: {
|
|
}
|
|
}
|
|
</config>
|