zz--front/components/recruitment.vue

<template>
	<view id="recruitment">
		<view style="z-index: 999;">
			<u-navbar title="求职中心" :is-back="false">
				<view class="slot-wrap"><image src="/static/search.png" class="search" @click="jumpSearch"></image></view>
			</u-navbar>
		</view>
		<scroll-view
			scroll-y="true"
			@scroll="scroll"
			style="padding-top: 20rpx;"
			:style="'height: ' + windowHeight + 'px;'"
			@scrolltolower="scrollTolower"
			refresher-enabled
			@refresherpulling="pulling"
			@refresherrefresh="refresher"
			@refresherrestore="restore"
			:refresher-triggered="triggered"
		>
			<swiper class="swiper" :autoplay="true" previous-margin="15px" next-margin="15px" :circular="true">
				<swiper-item v-for="(item, index) in list" :key="index" style="padding: 0px 5px;box-sizing: border-box;">
					<view style="height: 100%;border-radius: 8px;overflow: hidden;">
						<image :src="$method.splitImgHost(item.adverUrl,true,500)" mode="" style="width: 100%;height: 100%;" @click="swiperClick(index)"></image>
					</view>
				</swiper-item>
			</swiper>
			<view style="margin: 31rpx 35rpx 24rpx;display: flex;align-items: center;">
				<view style="padding: 5rpx;margin-right: 16rpx;"><image src="/static/select.png" class="arr-icon" @click="showStatus"></image></view>
				<view class="dis_ssy">
					<view class="lszty" @click="sectionChange(0)" :class="current == 0 ?'acszty':''">找岗位</view>
					<view class="lszty" @click="sectionChange(1)" :class="current == 1 ?'acszty':''">找企业</view>
					<!-- <template>
								<u-subsection
									@change="sectionChange"
									height="54"
									button-color="rgba(47,67,121,0.6)"
									bg-color="#F8F9FF"
									active-color="#FFFFFF"
									inactive-color="#636A75"
									:bold="false"
									:list="tab_list"
									:current="current"
								></u-subsection>
							</template> -->
				</view>
				<view style="width: 90px;" @click="showCityPicker = true">
					<view class="slh">{{ city === null ? '全国' : city }}</view>
				</view>
			</view>
			<view v-if="current === 0">
				<view v-if="posts.length === 0">
					<u-empty  margin-top="150" text="暂无岗位" mode="data"></u-empty>
				</view>
				<view v-else class="boxsize lines" v-for="(item, index) in posts" :key="index" @click="jumpDetails(item)">
					<view class="top_sty">
						<view>
							<view class="heasd">
								{{ item.job }}
								<image v-if="item.isUrgent === 1" style="width:27rpx;height:27rpx;" src="../static/ji@3x.png" mode=""></image>
							</view>
							<view class="fotHs">{{ item.companyName }}</view>
						</view>
						<view class="priceSty">
							{{ item.incomeStart === item.incomeEnd ? item.incomeStart : item.incomeStart + '~' + item.incomeEnd }}/{{ item.incomeType === 1 ? '月' : '年' }}
						</view>
					</view>
					<view class="dis_foter">
						<view class="dis_f">
							<view class="fot_size">{{ item.workingYearsLabel }}</view>
							<view class="fot_size">{{ item.minimumEduLabel }}</view>
							<view class="yys" v-for="(items, indexs) in item.bonusCertificate" :key="indexs">{{ items }}</view>
						</view>
						<view class="right_address">{{ item.city }}•{{ item.district }}</view>
					</view>
				</view>
				<u-divider v-if="total == posts.length && posts.length !== 0">到底啦</u-divider>
			</view>
			<view v-if="current === 1">
				<view v-if="enterprise.length === 0">
					<u-empty  margin-top="150" text="暂无岗位" mode="data"></u-empty>
				</view>
				<view v-else class="boxsize" v-for="(item, index) in enterprise" :key="index">
					<view class="dis_flexs" @click="jumpCompany(item)">
						<view class="imgboxs"><image style="width: 100%; height: 100%;" :src="$method.splitImgHost(item.logoUrl)" mode=""></image></view>
						<view style="flex: 1;">
							<view class="headTits">{{ item.companyName }}</view>
							<view class="lisz">
								<view class="bqB">{{ item.city }}</view>
								<view class="bqB">{{ item.companyType }}</view>
								<view class="bqB">{{ item.companySize }}</view>
							</view>
						</view>
					</view>
					<view class="tnsz">
						<view class="litns" v-for="(items, indexs) in item.newNumObj" :key="indexs" @click="jumpDetails(items)">{{ items.job }}</view>
						<view class="moreLs" v-if="item.recruitNeedsVoList.length > 3" @click="jumpDetails(item.recruitNeedsVoList[0])">•••</view>
					</view>
				</view>
				<u-divider v-if="total1 == enterprise.length && enterprise.length !== 0">到底啦</u-divider>
			</view>
		</scroll-view>
		<u-popup v-model="show" border-radius="14">
			<view class="flex-d" style="width: 600rpx">
				<view class="popup_t1">
					<view class="mors" :class="activePopBtn === 0 ? 'activesSty' : ''" @click="activePopBtn = 0">岗位筛选</view>
					<view class="mors" style="margin-left: 32rpx;" :class="activePopBtn === 1 ? 'activesSty' : ''" @click="activePopBtn = 1">企业筛选</view>
				</view>
				<view class="contentZ" v-if="activePopBtn === 0">
					<view class="heards">工作类型</view>
					<view class="boxPlus">
						<view
							class="liszing"
							v-for="(item, index) in workTypeList"
							:key="index"
							@click="activeWorkType(item)"
							:class="workActiveBoxs.indexOf(item) !== -1 ? 'activesLiszing' : ''"
						>
							{{ item }}
						</view>
						<view style="clear: both;"></view>
					</view>
					<view class="heards">薪资范围</view>
					<view class="priceType">
						<view class="lstq" :class="priceType === 1 ? 'activeLstq' : ''" @click="priceType = 1">月薪</view>
						<view class="lstq" :class="priceType === 2 ? 'activeLstq' : ''" @click="priceType = 2">年薪</view>
					</view>
					<view class="priceInput">
						<input class="inputSty" type="number" value="" placeholder="最低(元)" v-model="incomeStart" />
						至
						<input class="inputSty" type="number" value="" placeholder="最高(元)" v-model="incomeEnd" />
					</view>
					<view class="heards">学历要求(可多选)</view>
					<view class="boxPlus">
						<view
							class="liszing"
							v-for="(item, index) in eduList"
							:key="index"
							@click="activeEduType(item)"
							:class="eduActiveBoxs.indexOf(item.value) !== -1 ? 'activesLiszing' : ''"
						>
							{{ item.label }}
						</view>
						<view style="clear: both;"></view>
					</view>
					<view class="heards">工作年限(可多选)</view>
					<view class="boxPlus">
						<view
							class="liszing"
							v-for="(item, index) in workYearsList"
							:key="index"
							@click="activeWorkYearsType(item)"
							:class="workYearsActiveBoxs.indexOf(item.value) !== -1 ? 'activesLiszing' : ''"
						>
							{{ item.label }}
						</view>
						<view style="clear: both;"></view>
					</view>
				</view>
				<view class="contentZ" v-if="activePopBtn === 1">
					<view class="heards">企业规模(可多选)</view>
					<view class="boxPlus">
						<view
							class="liszing"
							v-for="(item, index) in companySizeList"
							:key="index"
							@click="activeCompanySize(item)"
							:class="companySizeActiveBoxs.indexOf(item.value) !== -1 ? 'activesLiszing' : ''"
						>
							{{ item.label }}
						</view>
						<view style="clear: both;"></view>
					</view>
					<view class="heards">公司类型(可多选)</view>
					<view class="boxPlus">
						<view
							class="liszing"
							v-for="(item, index) in companyTypeList"
							:key="index"
							@click="activeCompanyType(item)"
							:class="companyTypeActiveBoxs.indexOf(item.value) !== -1 ? 'activesLiszing' : ''"
						>
							{{ item.label }}
						</view>
						<view style="clear: both;"></view>
					</view>
				</view>
				<view class="fots">
					<view class="leftBtns" @click="initLists">重置筛选</view>
					<view class="right_Btns" @click="searchPageInfos">确定筛选</view>
				</view>
			</view>
		</u-popup>
		<u-picker mode="region" v-model="showCityPicker" :params="{ province: true, city: true }" @confirm="activeCitys"></u-picker>
	</view>
</template>

<script>
export default {
	name: 'recruitment',
	data() {
		return {
			list: [],
			showCityPicker: false,
			province: null,
			city: null,
			activePopBtn: 0,
			windowHeight: 0,
			show: false,
			tab_list: [
				{
					name: '找岗位'
				},
				{
					name: '找企业'
				}
			],
			posts: [], //岗位列表
			enterprise: [], //企业列表
			current: 0,
			pageNum: 1,
			pageSize: 8,
			total: 0,
			pageNum1: 1,
			pageSize1: 8,
			total1: 0,
			workTypeList: ['全职', '兼职', '实习生'], //工作类型
			workActiveBoxs: [], //选中工作类型
			priceType: 1, //薪资类型 1月薪2年薪
			incomeStart: '', //薪资起点
			incomeEnd: '', //薪资结点
			eduList: [], //学历
			eduActiveBoxs: [], //选中学历
			workYearsList: [], //工作年限类型
			workYearsActiveBoxs: [], //选中工作年限类型

			companySizeList: [], //公司规模
			companySizeActiveBoxs: [], //选中公司规模
			companyTypeList: [], //公司类型
			companyTypeActiveBoxs: [], //选中公司类型
			sxGW: false,
			sxCM: false,
			triggered: false
		};
	},
	created() {
		this.windowHeight = uni.getSystemInfoSync().windowHeight - 120;
	},
	mounted() {
		this.inits();
		this.getDict();
		this.advertisingList();
	},
	methods: {
		pulling() {
			this.triggered = true;
		},
		refresher() {
			let that = this
			this.inits();
			this.getDict();
			this.advertisingList();
			setTimeout(function(){
				that.triggered = false
			},500)
		},
		restore() {
			this.triggered = false;
		},
		swiperClick(index) {
			let item = this.list[index];
			uni.navigateTo({
				url: item.jumpUrl
			});
		},
		advertisingList() {
			let self = this;
			this.$api.advertisingList().then(res => {
				self.list = res.data.rows.filter((item, index) => {
					return item.type === 2;
				});
			});
		},
		getDict() {
			var self = this;
			this.$api.dictList().then(res => {
				res.data.data.forEach((item, index) => {
					if (item.dictType == 'edu_level') {
						self.eduList.push({ label: item.dictLabel, value: item.dictCode });
					}
					if (item.dictType == 'working_years') {
						if (item.dictCode !== 109) {
							self.workYearsList.push({ label: item.dictLabel, value: item.dictCode });
						}
					}
					if (item.dictType == 'company_size') {
						self.companySizeList.push({ label: item.dictLabel, value: item.dictCode });
					}
					if (item.dictType == 'company_type') {
						self.companyTypeList.push({ label: item.dictLabel, value: item.dictCode });
					}
				});
			});
		},
		inits() {
			this.getCurrentGW();
			this.getCurrentCM();
		},
		jumpSearch() {
			this.$navTo.togo('/pages2/index/searchRecruit', {});
		},
		scroll(e) {},
		getCurrentGW(v) {
			var self = this;
			var data = {
				pageNum: this.pageNum,
				pageSize: this.pageSize
			};
			if (this.city !== null && this.province !== null) {
				data.province = this.province;
				data.city = this.city;
			}
			if (v) {
				if (this.workActiveBoxs.length) {
					data.jobNature = this.workActiveBoxs.toString();
				}
				if (this.incomeStart !== '' || this.incomeEnd !== '') {
					if (this.incomeStart !== '' && this.incomeEnd !== '') {
						var testPrice = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/;
						if (!testPrice.test(Number(this.incomeStart))) {
							uni.showToast({
								title: '请规范填写最低薪资',
								icon: 'none'
							});
							return;
						}
						if (!testPrice.test(Number(this.incomeEnd))) {
							uni.showToast({
								title: '请规范填写最高薪资',
								icon: 'none'
							});
							return;
						}
						if (Number(this.incomeStart) > Number(this.incomeEnd)) {
							uni.showToast({
								title: '请规范填写薪资范围',
								icon: 'none'
							});
							return;
						}
						data.incomeType = this.priceType;
						data.incomeList = [{ incomeStart: Number(this.incomeStart), incomeEnd: Number(this.incomeEnd) }];
					} else {
						uni.showToast({
							title: '请填写薪资范围',
							icon: 'none'
						});
						return;
					}
				}
				if (this.eduActiveBoxs.length) {
					data.minimumEduDictList = this.eduActiveBoxs.toString();
				}
				if (this.workYearsActiveBoxs.length) {
					data.workingYearsDictList = this.workYearsActiveBoxs.toString();
				}
			}
			this.$api.recruitneedslist(data).then(res => {
				if (res.data.code === 200) {
					self.total = res.data.total;
					res.data.rows.forEach((item, index) => {
						if (item.jobNature) {
							item.jobNature = item.jobNature.split(',');
						}
						if (item.welfare) {
							item.welfare = item.welfare.split(',');
						}
						if (item.bonusCertificate) {
							item.bonusCertificate = item.bonusCertificate.split(',');
						}
					});
					self.posts = res.data.rows;
					self.show = false;
				}
			});
		},
		getCurrentCM(v) {
			var self = this;
			var data1 = {
				pageNum: this.pageNum1,
				pageSize: this.pageSize1
			};
			if (this.city !== null && this.province !== null) {
				data1.province = this.province;
				data1.city = this.city;
			}
			if (v) {
				if (this.companySizeActiveBoxs.length) {
					data1.sizeIds = this.companySizeActiveBoxs.toString();
				}
				if (this.companyTypeActiveBoxs.length) {
					data1.typeIds = this.companyTypeActiveBoxs.toString();
				}
			}
			this.$api.recruitcompanyConlist(data1).then(res => {
				if (res.data.code === 200) {
					self.total1 = res.data.total;
					for (let k = 0; k < res.data.rows.length; k++) {
						if (res.data.rows[k].recruitNeedsVoList) {
							var anum = [];
							for (let i = 0; i < res.data.rows[k].recruitNeedsVoList.length; i++) {
								if (i >= 3) {
									break;
								} else {
									anum.push(res.data.rows[k].recruitNeedsVoList[i]);
								}
							}
							res.data.rows[k].newNumObj = anum;
						}
					}
					self.enterprise = res.data.rows;
					self.show = false;
				}
			});
		},
		searchPageInfos() {
			var self = this;
			if (this.activePopBtn === 0) {
				this.current = 0;
				this.sxGW = true;
				this.getCurrentGW(true);
			}
			if (this.activePopBtn === 1) {
				this.current = 1;
				this.sxCM = true;
				this.getCurrentCM(true);
			}
		},
		jumpCompany(v) {
			var data = {
				companyId: v.companyId
			};
			if (v.recruitNeedsVoList.length > 0) {
				data.id = v.recruitNeedsVoList[0].id;
			}
			this.$navTo.togo('/pages2/recruitment/detailsInfo', data);
		},
		jumpDetails(v) {
			this.$navTo.togo('/pages2/recruitment/detailsInfo', {
				id: v.id,
				companyId: v.companyId
			});
		},
		scrollTolower() {
			var self = this;
			if (this.current === 0) {
				if (this.total > this.posts.length) {
					var data = {
						pageNum: this.pageNum + 1,
						pageSize: this.pageSize
					};
					if (this.sxGW) {
						if (this.workActiveBoxs.length) {
							data.jobNature = this.workActiveBoxs.toString();
						}
						if (this.incomeStart !== '' || this.incomeEnd !== '') {
							if (this.incomeStart !== '' && this.incomeEnd !== '') {
								var testPrice = /((^[1-9]\d*)|^0)(\.\d{0,2}){0,1}$/;
								if (!testPrice.test(Number(this.incomeStart))) {
									uni.showToast({
										title: '请规范填写最低薪资',
										icon: 'none'
									});
									return;
								}
								if (!testPrice.test(Number(this.incomeEnd))) {
									uni.showToast({
										title: '请规范填写最高薪资',
										icon: 'none'
									});
									return;
								}
								if (Number(this.incomeStart) > Number(this.incomeEnd)) {
									uni.showToast({
										title: '请规范填写薪资范围',
										icon: 'none'
									});
									return;
								}
								data.incomeType = this.priceType;
								data.incomeList = [{ incomeStart: Number(this.incomeStart), incomeEnd: Number(this.incomeEnd) }];
							} else {
								uni.showToast({
									title: '请填写薪资范围',
									icon: 'none'
								});
								return;
							}
						}
						if (this.eduActiveBoxs.length) {
							data.minimumEduDictList = this.eduActiveBoxs.toString();
						}
						if (this.workYearsActiveBoxs.length) {
							data.workingYearsDictList = this.workYearsActiveBoxs.toString();
						}
					}
					this.$api.recruitneedslist(data).then(res => {
						if (res.data.code === 200) {
							self.pageNum++;
							res.data.rows.forEach((item, index) => {
								if (item.jobNature) {
									item.jobNature = item.jobNature.split(',');
								}
								if (item.welfare) {
									item.welfare = item.welfare.split(',');
								}
								if (item.bonusCertificate) {
									item.bonusCertificate = item.bonusCertificate.split(',');
								}
								self.posts.push(item);
							});
						}
					});
				}
			}
			if (this.current === 1) {
				if (this.total1 > this.enterprise.length) {
					var data1 = {
						pageNum: this.pageNum1 + 1,
						pageSize: this.pageSize1
					};
					if (this.sxCM) {
						if (this.companySizeActiveBoxs.length) {
							data1.sizeIds = this.companySizeActiveBoxs.toString();
						}
						if (this.companyTypeActiveBoxs.length) {
							data1.typeIds = this.companyTypeActiveBoxs.toString();
						}
					}
					this.$api.recruitcompanyConlist(data1).then(res => {
						if (res.data.code === 200) {
							self.pageNum1++;
							for (let k = 0; k < res.data.rows.length; k++) {
								if (res.data.rows[k].recruitNeedsVoList) {
									var anum = [];
									for (let i = 0; i < res.data.rows[k].recruitNeedsVoList.length; i++) {
										if (i >= 3) {
											break;
										} else {
											anum.push(res.data.rows[k].recruitNeedsVoList[i]);
										}
									}
									res.data.rows[k].newNumObj = anum;
								}
								self.enterprise.push(res.data.rows[k]);
							}
						}
					});
				}
			}
		},
		sectionChange(index) {
			this.current = index;
		},
		initLists() {
			if (this.activePopBtn === 0) {
				this.priceType = 1; //薪资类型 1月薪2年薪
				this.incomeStart = ''; //薪资起点
				this.incomeEnd = ''; //薪资结点
				this.workActiveBoxs = [];
				this.eduActiveBoxs = [];
				this.workYearsActiveBoxs = [];
				this.province = null;
				this.city = null;
				this.sxGW = false;
				this.getCurrentGW();
			}
			if (this.activePopBtn === 1) {
				this.companySizeActiveBoxs = [];
				this.companyTypeActiveBoxs = [];
				this.province = null;
				this.city = null;
				this.sxCM = false;
				this.getCurrentCM();
			}
		},
		initAll() {
			if (this.current === 0) {
				this.priceType = 1; //薪资类型 1月薪2年薪
				this.incomeStart = ''; //薪资起点
				this.incomeEnd = ''; //薪资结点
				this.workActiveBoxs = [];
				this.eduActiveBoxs = [];
				this.workYearsActiveBoxs = [];
				this.sxGW = false;
				this.getCurrentGW();
			}
			if (this.current === 1) {
				this.companySizeActiveBoxs = [];
				this.companyTypeActiveBoxs = [];
				this.sxCM = false;
				this.getCurrentCM();
			}
		},
		showStatus() {
			if(this.current === 0){
				this.activePopBtn = 0
			}
			if(this.current === 1){
				this.activePopBtn = 1
			}
			this.show = true;
		},
		activeWorkType(item) {
			if (this.workActiveBoxs.indexOf(item) !== -1) {
				this.workActiveBoxs.splice(this.workActiveBoxs.indexOf(item), 1);
			} else {
				this.workActiveBoxs.push(item);
			}
		},
		activeEduType(item) {
			if (this.eduActiveBoxs.indexOf(item.value) !== -1) {
				this.eduActiveBoxs.splice(this.eduActiveBoxs.indexOf(item.value), 1);
			} else {
				this.eduActiveBoxs.push(item.value);
			}
		},
		activeWorkYearsType(item) {
			if (this.workYearsActiveBoxs.indexOf(item.value) !== -1) {
				this.workYearsActiveBoxs.splice(this.workYearsActiveBoxs.indexOf(item.value), 1);
			} else {
				this.workYearsActiveBoxs.push(item.value);
			}
		},
		activeCompanySize(item) {
			if (this.companySizeActiveBoxs.indexOf(item.value) !== -1) {
				this.companySizeActiveBoxs.splice(this.companySizeActiveBoxs.indexOf(item.value), 1);
			} else {
				this.companySizeActiveBoxs.push(item.value);
			}
		},
		activeCompanyType(item) {
			if (this.companyTypeActiveBoxs.indexOf(item.value) !== -1) {
				this.companyTypeActiveBoxs.splice(this.companyTypeActiveBoxs.indexOf(item.value), 1);
			} else {
				this.companyTypeActiveBoxs.push(item.value);
			}
		},
		activeCitys(options) {
			this.province = options.province.label;
			this.city = options.city.label;
			if (this.current === 0) {
				this.getCurrentGW();
			}
			if (this.current === 1) {
				this.getCurrentCM();
			}
		}
	}
};
</script>

<style scoped>
.slh {
	line-height: 54rpx;
	height: 54rpx;
	text-align: center;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	word-wrap: break-word;
	white-space: normal !important;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}
.search {
	width: 40rpx;
	height: 40rpx;
	margin-left: 30rpx;
}
.slot-wrap {
	display: flex;
	align-items: center;
}
.tests {
	background-color: #00ffff;
	margin-bottom: 20rpx;
}
.swiper {
	height: 329rpx;
}
.arr-icon {
	width: 40rpx;
	height: 40rpx;
}
.popup_t1 {
	display: flex;
	align-items: center;
	padding-left: 35rpx;
	border-bottom: 1rpx solid #eee;
	height: 57rpx;
	margin-top: 86rpx;
}
.mors {
	font-size: 30rpx;
	font-weight: bold;
	color: #999;
}
.activesSty {
	font-size: 30rpx;
	font-weight: bold;
	color: #2a4174;
}
.boxsize {
	border-radius: 32rpx;
	background: #ffffff;
	box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(47, 67, 121, 0.05);
	margin: 0rpx 35rpx 24rpx;
	padding: 22rpx 20rpx;
}
.lines {
	height: 196rpx;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.dis_flexs {
	display: flex;
	margin-bottom: 24rpx;
}
.dis_flexs > .imgboxs {
	width: 100rpx;
	height: 100rpx;
	border-radius: 24rpx;
	overflow: hidden;
	margin-right: 24rpx;
}
.top_sty {
	display: flex;
	justify-content: space-between;
}
.dis_foter {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.dis_f {
	display: flex;
	align-items: center;
	overflow-x: auto;
	flex: 1;
	margin-right: 20rpx;
}
.right_address {
	font-weight: 500;
	font-size: 24rpx;
	color: #636a75;
}
.fot_size {
	height: 32rpx;
	line-height: 32rpx;
	padding: 0rpx 12rpx;
	margin-right: 8rpx;
	border-radius: 16rpx;
	font-size: 20rpx;
	background: #f2f6ff;
	flex-shrink: 0;
	color: #636a75;
}
.yys {
	height: 32rpx;
	font-size: 20rpx;
	line-height: 32rpx;
	padding: 0rpx 12rpx;
	margin-right: 8rpx;
	border-radius: 16rpx;
	color: #fff;
	background: #3fefb7;
	flex-shrink: 0;
}
.heasd {
	font-size: 30rpx;
	font-weight: bold;
	color: #2a4174;
	margin-bottom: 14rpx;
}
.fotHs {
	font-size: 20rpx;
	font-weight: 500;
	color: #636a75;
}
.priceSty {
	font-weight: bold;
	font-size: 28rpx;
	color: #32467b;
}
.headTits {
	font-size: 30rpx;
	font-weight: bold;
	color: #2a4174;
	margin-bottom: 26rpx;
}
.lisz {
	display: flex;
	align-items: center;
}
.lisz > .bqB {
	border-radius: 16rpx;
	background-color: #f2f6ff;
	padding: 0rpx 22rpx;
	text-align: center;
	height: 32rpx;
	line-height: 32rpx;
	margin-right: 8rpx;
	font-size: 20rpx;
	color: #636a75;
}
.tnsz {
	display: flex;
	align-items: center;
}
.litns {
	padding: 0rpx 15rpx;
	margin-right: 24rpx;
	border-radius: 16rpx;
	height: 48rpx;
	line-height: 48rpx;
	background-color: #32467b;
	color: #fff;
	box-shadow: 0rpx 0rpx 5rpx 0rpx rgba(47, 67, 121, 0.05);
	font-size: 26rpx;
	font-weight: bold;
}
.moreLs {
	border-radius: 16rpx;
	font-size: 26rpx;
	font-weight: bold;
	color: #32467b;
	border: 1rpx solid #32467b;
	padding: 0rpx 11rpx;
	height: 48rpx;
	letter-spacing: 1rpx;
	line-height: 40rpx;
}
.flex-d {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
}
.contentZ {
	flex: 1;
	overflow-y: auto;
	padding-left: 35rpx;
}
.contentZ::-webkit-scrollbar {
	display: none;
}
.fots {
	height: 100rpx;
	display: flex;
	align-items: center;
	justify-content: space-around;
	border-top: 1rpx solid #eee;
}
.leftBtns {
	font-size: 30rpx;
	color: #32467b;
	font-weight: 500;
}
.right_Btns {
	font-size: 30rpx;
	color: #fff;
	background-color: #32467b;
	border-radius: 24rpx;
	height: 60rpx;
	line-height: 60rpx;
	text-align: center;
	padding: 0rpx 23rpx;
	box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
}
.heards {
	margin: 25rpx 0rpx;
	font-size: 24rpx;
	color: #32467b;
	font-weight: bold;
}
.liszing {
	float: left;
	width: 161rpx;
	height: 57rpx;
	text-align: center;
	line-height: 57rpx;
	border: 1rpx solid transparent;
	border-radius: 16rpx;
	color: #999;
	background-color: #f5f7f9;
	margin-right: 13rpx;
	margin-bottom: 13rpx;
}
.activesLiszing {
	color: #2a4174;
	border-color: #2a4174;
}
.priceType {
	display: flex;
	align-items: center;
	margin-bottom: 22rpx;
}
.lstq {
	font-size: 30rpx;
	color: #999;
	font-weight: 400;
	margin-right: 27rpx;
}
.activeLstq {
	color: #2a4174;
	font-weight: 500;
}
.priceInput {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-right: 56rpx;
}
.inputSty {
	border: none;
	border-bottom: 1rpx solid #eee;
	/* width: 220rpx; */
	text-align: center;
}
.dis_ssy {
	flex: 1;
	display: flex;
	align-items: center;
	height: 56rpx;
	border-radius: 20rpx;
	background-color: #f8f9ff;
}
.lszty {
	height: 44rpx;
	line-height: 44rpx;
	width: 50%;
	text-align: center;
	border-radius: 16rpx;
	color: #636a75;
	font-size: 24rpx;
	transition: all 0.3s;
}
.acszty {
	color: #fff;
	background: rgba(47, 67, 121, 0.6);
}
</style>