odd_job_applet/pages/index/index.vue

<template>
	<view>
		
		<view class="bg-white echo-top">
			<image class="echo-topbg" mode="widthFix" :src="param.indextopbg"></image>
			<view style="position: relative;">
				<view class="cu-bar search" style="position: absolute; left: 0px; right: 0px; margin: 0px auto; top: 0rpx; z-index: 999; width: 90%;">
					<view class="search-form round text-center">
						<text class="cuIcon-search"></text>
						<input @input="bindInput" :adjust-position="false" type="text" placeholder="搜索职位或公司" confirm-type="search"></input>
					</view>
					<view class="action" v-if="searchval!==''">
						<button class="cu-btn bg-white shadow-blur round" @click="btnSearch()">搜索</button>
					</view>
				</view>
				<swiper class="screen-swiper round-dot" style="min-height: 280rpx !important;" :indicator-dots="true" :circular="true"
				 :autoplay="true" interval="5000" duration="500">
					<block v-for="(item,index) in slide" :key="index">
						<swiper-item @tap="pageUrl(item.stype, item.tilurl)">
							<image :src="item.tilpic" mode="scaleToFill"></image>
						</swiper-item>
					</block>
				</swiper>
			</view>
			<!-- 招聘头条 -->
			<!-- <view class="uni-swiper-msg bg-white solid-top padding-lr-sm solid-bottom noticbox" v-if="article.length>0">
				<view class="uni-swiper-msg-icon text-xl">
					<image :src="$getImageUrl('static/images/applet/iconNotice.png')"></image>
				</view>
				<swiper :autoplay="true" :circular="true" :vertical="true" interval="5000">
					<swiper-item v-for="(item, index) in article" :key="index">
						<navigator :url="'/pages/article/detail?articleid='+item.id">{{item.title}}</navigator>
					</swiper-item>
				</swiper>
			</view> -->
			<!-- 加群 -->
			<view class="bg-white join-group" @tap="showConcatModel">
				<view class="join-left">
					<image class="myicon" mode="widthFix" :src="$getImageUrl('static/images/applet/wechat_group.png')"></image>
				</view>
				<view class="join-right">
					<view class="arrow">
						添加企业微信拉你入群<text class="text-blue margin-left-sm">加入群聊</text>
					</view>
					<view class="arrow">
						客服电话<text class="margin-left-sm">19959780161</text><text class="text-blue margin-left-sm">联系客服</text>
					</view>
				</view>
			</view>
			<!-- 导航 -->
			<!-- <view class="text-center">
				<view class="cu-list grid col-4 no-border echo-grid">
					<block v-for="(item,index) in navigation" :key="item.id">
						<view class="cu-item" @tap="pageUrl(item.ntype, item.tilurl)">
							<image :src="item.tilpic" mode="widthFix"></image>
							<text>{{item.title}}</text>
						</view>
					</block>
				</view>
			</view> -->
			<view class="lw-nav-broker">
				<image class="img" @tap="pageUrl(1,'/pages/broker/brokerform')" :src="$getImageUrl('static/images/applet/index_incon1.png')" mode="widthFix"></image>
			</view>
			<view class="lw-nav">
				<image class="img" @tap="goNavPage('/pages/comjobs/comjobs')" :src="$getImageUrl('static/images/applet/index_incon2.png')" mode="widthFix"></image>
				<image class="img" @tap="develop()" :src="$getImageUrl('static/images/applet/index_incon3.png')" mode="widthFix"></image>
				<image class="img" @tap="develop()" :src="$getImageUrl('static/images/applet/index_incon4.png')" mode="widthFix"></image>
				<image class="img" @tap="develop()" :src="$getImageUrl('static/images/applet/index_incon5.png')" mode="widthFix"></image>
			</view>
		</view>
		

		<!-- 企业招聘 -->
		<view class="text-bold padding-left-lg bg-white text-xl">推荐职位</view>
		<view class="cu-bar bg-white" style="text-align: center; height: 80rpx !important; min-height: 80rpx !important;">
			<!--<image :src="$getImageUrl('static/images/applet/indextil.png')" style="width: 150rpx; height: 35rpx; margin: 0 auto;"></image>-->
				
				<view class="flex text-center padding-lr-xs" style="width: 100%; height: 80rpx; font-size: 35rpx; font-weight: bold;line-height: 80rpx;">
					<view class="cu-item text-df margin-lr-sm" :class="status==0?'text-blue cur selectok':''" @tap="tabSelect" data-status="0">热门推荐</view>
					<view class="cu-item text-df margin-lr-sm" :class="status==1?'text-blue cur selectok':''" @tap="tabSelect" data-status="1">附近职位</view>
					<view class="cu-item text-df margin-lr-sm" :class="status==2?'text-blue cur selectok':''" @tap="tabSelect" data-status="2" v-if="userinfo">猜你喜欢</view>
				</view>
			
		</view>
		<view  v-if="status==0">
		<block v-for="(item,index) in plist" :key="index">
			<view class="cu-card dynamic no-card solid-bottom echo-comjobs-item padding-top-sm padding-lr-sm radius">
				<view class="cu-item shadow padding-top-sm padding-bottom" @tap="goDetail(item.id)">
					<view class="padding-lr flex justify-between align-center">
						<view class="basis-lg text-bold text-df text-cut">
							{{item.title}}
							<text class="text-red text-sm" v-if="item.wtype==1">(按月)</text>
							<text class="text-red text-sm" v-if="item.wtype==2">(按时)</text>
							<text class="text-red text-sm" v-if="item.wtype==3">(按件)</text>
							<text class="text-red text-sm" v-if="item.wtype==4">(按项目)</text>
							<text class="text-sm">{{item.recruit_num}}名</text>
						</view>
						<view class="basis-sm text-cut text-right text-gray text-sm">
							<view><text class="text-red text-bold">{{item.zwagall}}</text></view>
						</view>
					</view>
					<view class="padding-lr padding-tb-xs text-cut">
						<view v-for="(titem,tindex) in item.tags" :key="tindex" class="cu-tag light bg-blue lg echo-tags-item">{{titem}}</view>
					</view>
					<view class="padding-lr text-cut text-sm flex justify-between align-center">
						<view class="basis-lg text-df text-cut">{{item.worker.title}}</view>
						<view class="basis-sm text-cut text-right text-sm">
							浏览量:{{item.volume}}
						</view>
					</view>
					<!-- <view class="text-gray padding-lr flex align-center justify-between" @tap="goShop(item.workerid)">
						<view class="flex align-center">
							<image class="iconyrz" :src="$getImageUrl('static/images/applet/iconyrz.png')" mode="scaleToFill"></image>
							<image class="iconwyp" :src="$getImageUrl('static/images/applet/iconwyp.png')" mode="scaleToFill" v-if="item.recruitment_cate==2"></image>
						</view>
						<view class="text-gray text-right basis-xs text-sm">
							<text class="cuIcon-shop margin-right-xs text-lg"></text>
							进店
						</view>
					</view> -->
				</view>
			</view>
		</block>
		<uni-load-more :status="pstatus"></uni-load-more>
		</view>
		<view  v-if="status==1">
		<!-- <view class="cu-card dynamic no-card solid-bottom echo-comjobs-item">
			<view class="cu-item shadow padding-top-sm padding-bottom" style="padding-left: 35rpx;">
				您当前的位置：经度 {{longitude}} 纬度 {{latitude}}<br>
				{{useraddress}}				
			</view>
		</view>	 -->
		<block v-for="(item,indexn) in plistn" :key="indexn">
			<view class="cu-card dynamic no-card solid-bottom echo-comjobs-item padding-top-sm padding-lr-sm radius">
				<view class="cu-item shadow padding-top-sm padding-bottom" @tap="goDetail(item.id)">
					<view class="padding-lr flex justify-between align-center">
						<view class="basis-lg text-bold text-df text-cut">
							{{item.title}}
							<text class="text-red text-sm" v-if="item.wtype==1">(按月)</text>
							<text class="text-red text-sm" v-if="item.wtype==2">(按时)</text>
							<text class="text-red text-sm" v-if="item.wtype==3">(按件)</text>
							<text class="text-red text-sm" v-if="item.wtype==4">(按项目)</text>
							<text class="text-sm">{{item.recruit_num}}名</text>
						</view>
						<view class="basis-sm text-cut text-right text-gray text-sm">
							<view><text class="text-red text-bold">{{item.zwagall}}</text></view>
						</view>
					</view>
					<view class="padding-lr padding-tb-xs text-cut">
						<view v-for="(titem,tindex) in item.tags" :key="tindex" class="cu-tag light bg-blue lg echo-tags-item">{{titem}}</view>
					</view>
					<view class="padding-lr text-cut text-sm flex justify-between align-center">
						<view class="basis-lg text-df text-cut">{{item.worker.title}}</view>
						<view class="basis-sm text-cut text-right text-sm">
							浏览量:{{item.volume}}
						</view>
					</view>
					<view class="padding-lr text-cut text-sm flex justify-between align-center">
						<view class="basis-lg text-df text-cut"></view>
						<view class="basis-sm text-cut text-right text-sm">
							{{item.distance}}
						</view>
					</view>
				</view>
				<!-- <view class="cu-item shadow padding-top-sm padding-bottom">
					<view class="padding-lr padding-bottom-xs flex justify-between align-center" @tap="goDetail(item.id)">
						<view class="basis-xl text-bold text-lg text-cut">{{item.title}}</view>
						<view class="basis-xs text-cut text-right text-gray text-sm">{{item.city}}</view>
					</view>
					<view class="padding-lr flex justify-between align-bottom" @tap="goDetail(item.id)">
						<view v-if="item.wtype==1"><text class="text-red text-bold">{{item.zwagall}}</text></view>
						<view v-if="item.wtype==5"><text class="text-red text-bold">其他</text></view>
						<view v-else><text class="text-red text-bold">{{item.bwagall}}</text></view>
						<view class="text-red">{{item.fwagall}}</view>
					</view>
					<view class="padding-lr text-cut" @tap="goDetail(item.id)">
						<view v-for="(titem,tindex) in item.tags" :key="tindex" class="cu-tag light bg-blue sm echo-tags-item">{{titem}}</view>
					</view>
					<view class="padding-lr flex justify-between align-bottom" @tap="goDetail(item.id)">						
						<view>{{item.worker.title}}</view>
						<view class="text-red">{{item.distance}}</view>
					</view>
					<view class="text-gray padding-lr flex align-center justify-between" @tap="goShop(item.workerid)">
						<view class="flex align-center">
							<image class="iconyrz" src="../../static/images/iconyrz.png" mode="scaleToFill"></image>
							<image class="iconwyp" src="../../static/images/iconwyp.png" mode="scaleToFill" v-if="item.recruitment_cate==2"></image>
						</view>
						<view class="text-gray text-right basis-xs text-sm">
							<text class="cuIcon-shop margin-right-xs text-lg"></text>
							进店
						</view>
					</view>
				</view> -->
			</view>
		</block>
		<uni-load-more :status="pstatusn"></uni-load-more>
		</view>
		
		<view  v-if="status==2">
		<block v-for="(item,index) in plistl" :key="index">
			<view class="cu-card dynamic no-card solid-bottom echo-comjobs-item padding-top-sm padding-lr-sm radius">
				<view class="cu-item shadow padding-top-sm padding-bottom" @tap="goDetail(item.id)">
					<view class="padding-lr flex justify-between align-center">
						<view class="basis-lg text-bold text-df text-cut">
							{{item.title}}
							<text class="text-red text-sm" v-if="item.wtype==1">(按月)</text>
							<text class="text-red text-sm" v-if="item.wtype==2">(按时)</text>
							<text class="text-red text-sm" v-if="item.wtype==3">(按件)</text>
							<text class="text-red text-sm" v-if="item.wtype==4">(按项目)</text>
							<text class="text-sm">{{item.recruit_num}}名</text>
						</view>
						<view class="basis-sm text-cut text-right text-gray text-sm">
							<view><text class="text-red text-bold">{{item.zwagall}}</text></view>
							<view v-if="item.recruitment_cate == 2"><text class="text-red text-bold">悬赏{{item.retmoney}}{{item.is_pay == 1 ? '（已支付）' : ''}}</text></view>
						</view>
					</view>
					<view class="padding-lr padding-tb-xs text-cut">
						<view v-for="(titem,tindex) in item.tags" :key="tindex" class="cu-tag light bg-blue lg echo-tags-item">{{titem}}</view>
					</view>
					<view class="padding-lr text-cut text-sm flex justify-between align-center">
						<view class="basis-lg text-df text-cut">{{item.worker.title}}</view>
						<view class="basis-sm text-cut text-right text-sm">
							浏览量:{{item.volume}}
						</view>
					</view>
					<!-- <view class="text-gray padding-lr flex align-center justify-between" @tap="goShop(item.workerid)">
						<view class="flex align-center">
							<image class="iconyrz" :src="$getImageUrl('static/images/applet/iconyrz.png')"></image>
							<image class="iconwyp" :src="$getImageUrl('static/images/applet/iconwyp.png')" mode="scaleToFill" v-if="item.recruitment_cate==2"></image>
						</view>
						<view class="text-gray text-right basis-xs text-sm">
							<text class="cuIcon-shop margin-right-xs text-lg"></text>
							进店
						</view>
					</view> -->
				</view>
			</view>
		</block>
		<uni-load-more :status="pstatus"></uni-load-more>
		</view>
		
		
		<!-- <button class="cu-btn bg-blue lg shadow echo-gohome" @tap="goHome"> 切换身份 </button> -->
		
		<view class="padding-sm"></view>
		<view class="padding-xl"></view>
		<view class="cu-bar tabbar bg-white foot">
			<view class="action text-blue" @tap="goNavPage('/pages/index/index')">
				<view class="cuIcon-cu-image">
					<image src="../../static/tabbar/indexSelected.png"></image>
				</view>
				首页
			</view>
			<view class="action text-gray" @tap="goNavPage('/pages/comjobs/comjobs')">
				<view class="cuIcon-cu-image">
					<image src="../../static/tabbar/jobs.png"></image>
				</view>
				招聘
			</view>
			<!-- #ifndef MP-WEIXIN -->
			<view class="action text-gray videoimg" @tap="goNavPage('/pages/video/videolist')">
				<view class="cuIcon-cu-image">
					<image src="../../static/tabbar/video.png"></image>
				</view>
				微工作
			</view>
			<!-- #endif -->
			
			<view class="action text-gray" @tap="goNavPage('/pages/broker/brokerlist')">
				<view class="cuIcon-cu-image">
					<image src="../../static/tabbar/broker.png"></image>
				</view>
				经纪人
			</view>
			
			<view class="action text-gray" @tap="goNavPage('/pages/my/my')">
				<view class="cuIcon-cu-image">
					<image src="../../static/tabbar/my.png"></image>
				</view>
				我的
			</view>
		</view>
		
		<wxContact ref="wxContact"></wxContact>
	</view>
</template>

<script>
	import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue";
	import QQMapWX from '@/common/qqmap-wx-jssdk';
	var _this;
	export default {
		components: {
			uniLoadMore
		},
		data() {
			return {
				userinfo: null,
				workerinfo: null,
				param: [],
				slide: [],
				cardCur: 0,

				searchval: "",

				article: [],
				navigation: [],

				pstatus: 'more',
				pstatusn: 'more',
				ppage: 1,
				ppagen: 1,
				psize: 20,
				psizen: 20,
				plist: [],
				plistn: [],
				plistl: [],
				status: 0,
				latitude:0.000000,
				longitude:0.000000,
				useraddress:"",
			};
		},
		onLoad: function(option) {
			_this = this;
			_this.status = option.status || 0;
			_this.userinfo = uni.getStorageSync('userinfo') || false;
			_this.workerinfo = uni.getStorageSync('workerinfo') || false;
			if (_this.workerinfo !== false) {
				uni.reLaunch({
					url: "/pages/worker/worker"
				});
				return false;
			}
			uni.getLocation({
			    success: function (res) {
					console.log(res);
			        console.log('纬度：' + res.latitude);
			        console.log('经度：' + res.longitude);
					_this.latitude = res.latitude;
					_this.longitude = res.longitude;
					// _this.qqmapsdk.reverseGeocoder({
					// 	    location: {
					// 	        latitude: res.latitude,
					// 			longitude: res.longitude
					// 	    },
					// 	    success: function (res) {
					// 			console.log(res.result.address_component);
					// 			//addressinfo=res.result.address_component;		
					// 			_this.useraddress = res.result.address_component.province + " " + res.result.address_component.city + " " + res.result.address_component.district;
					// 	    },
					// 	    fail: function (res) {
					// 		    console.log(res)
					// 		},
					// 		complete: function (res) {
					// 		    // console.log(res)
					// 	    }
					// })						
			    }
			});
			_this.$req.ajax({
				path: "index/getindexdata",
			}).then((data) => {
				_this.param = data.param;
				_this.slide = data.slide;
				_this.navigation = data.navigation;
				_this.article = data.article;
				_this.getMore();
			}).catch((err) => {
				uni.showModal({
					title: '信息提示',
					content: err,
					showCancel: false
				});
			});
			_this.qqmapsdk = new QQMapWX({
				// 在腾讯平台自己申请的秘钥
				key: 'L2PBZ-J53WR-FUXW6-WB3SD-NWCFO-WYBS6' 
			});
		},
		onShareAppMessage: function(res) {
			return {
				title: "晋江人力",
				path: "/pages/index/index"
			}
		},
		onPullDownRefresh: function() {			
			if(_this.status==0){
				_this.ppage = 1;
				_this.plist = [];
				_this.pstatus = 'more';
			}else if(_this.status==1){
				_this.ppagen = 1;
				_this.plistn = [];
				_this.pstatusn = 'more';
			}else if(_this.status==2){
				_this.ppagen = 1;
				_this.plistn = [];
				_this.plistl = 'more';
			}
			_this.getMore();
		},
		onReachBottom: function() {
			if(_this.status==0){
				if (_this.pstatus !== 'more') {
					return;
				}
			}else{
				if (_this.pstatusn !== 'more') {
					return;
				}
			}
			_this.getMore();
		},
		methods: {
			showConcatModel: function() {
				this.$refs.wxContact.showConcatModel();
			},
			goHome: function() {
				uni.setStorageSync('identityinfo', false);
				uni.setStorageSync('workerinfo', null);
				uni.reLaunch({
					url: "/pages/index/home"
				});
			},
			tabSelect: function(e) {
				_this.status = e.currentTarget.dataset.status;
				_this.pageRefresh();
			},
			// 搜索
			bindInput: function(e) {
				_this.searchval = e.detail.value;
			},
			btnSearch: function() {
				if (_this.searchval == "") {
					uni.showModal({
						title: '信息提示',
						content: "请输入要搜索的关键字...",
						showCancel: false
					});
					return false;
				}
				uni.navigateTo({
					url: '/pages/comjobs/comjobs?searchval=' + _this.searchval
				});
			},
			pageRefresh: function() {
				if(_this.status==0){
					_this.pstatus = 'more';
					_this.ppage = 1;
					_this.plist = [];
				}else if(_this.status==1){
					_this.pstatusn = 'more';
					_this.ppagen = 1;
					_this.plistn = [];
				} else if(_this.status==2){
					_this.pstatusn = 'more';
					_this.ppagen = 1;
					_this.plistl = [];
				}
				_this.getMore();
			},
			getMore: function() {
				// 热门职位
				if(_this.status==0){
					_this.$req.ajax({
						path: "index/listcomjobs",
						data: {
							ppage: _this.ppage,
							psize: _this.psize
						}
					}).then((data) => {
						_this.pstatus = data.pstatus;
						_this.plist = _this.plist.concat(data.plist);
						_this.ppage += 1;
						uni.stopPullDownRefresh();
					}).catch((err) => {
						uni.showModal({
							title: '信息提示',
							content: err,
							showCancel: false
						});
					});
				}else if(_this.status==1){
					// 附近职位
					_this.$req.ajax({
						path: "index/listComjobsofnear",
						data: {
							ppage: _this.ppagen,
							psize: _this.psizen,
							lat: _this.latitude,
							lng: _this.longitude
						}
					}).then((data) => {
						_this.pstatusn = data.pstatus;
						_this.plistn = _this.plistn.concat(data.plist);
						_this.ppagen += 1;
						uni.stopPullDownRefresh();
					}).catch((err) => {
						uni.showModal({
							title: '信息提示',
							content: err,
							showCancel: false
						});
					});
				}else if(_this.status==2){
					// 猜你喜欢
					_this.$req.ajax({
						path: "index/listComjobsLike",
						data: {
							ppage: _this.ppagen,
							psize: _this.psizen,
							userid: _this.userinfo.id,
						}
					}).then((data) => {
						_this.pstatusn = data.pstatus;
						_this.plistl = _this.plistl.concat(data.plist);
						_this.ppagen += 1;
						uni.stopPullDownRefresh();
					}).catch((err) => {
						uni.showModal({
							title: '信息提示',
							content: err,
							showCancel: false
						});
					});
				}
			},
			
			goDetail: function(comjobsid) {
				uni.navigateTo({
					url: '/pages/comjobs/detail?comjobsid=' + comjobsid
				});
			},
			goShop: function(workerid) {
				uni.navigateTo({
					url: '/pages/worker/shop?workerid=' + workerid
				});
			},
			onClick: function(index) {
				var nav = that.navigation[index.index];
				if (nav.type == 1) {
					uni.navigateTo({
						url: nav.link
					});
				} else {
					// #ifdef H5
					location.href = nav.link;
					// #endif
					// #ifndef H5
					uni.navigateTo({
						url: '/pages/tool/webview?pagesrc=' + encodeURIComponent(nav.link)
					});
					// #endif
				}
			},
			
			develop() {
				uni.showModal({
					title: '信息提示',
					content: '正在开发中，敬请期待',
					showCancel: false
				});
			},
			goNavPage: function(pageurl) {
				uni.redirectTo({
					url: pageurl
				});
			},
			// 轮播图
			cardSwiper: function(e) {
				_this.cardCur = e.detail.current
			},
			pageUrl: function(type, tilurl) {
				if (type == 1) {
					uni.navigateTo({
						url: tilurl,
						fail: function() {
							uni.switchTab({
								url: tilurl
							});
						}
					});
				} else {
					uni.navigateTo({
						url: '/pages/tool/webview?pagesrc=' + encodeURIComponent(tilurl)
					});
				}
			},
		}
	};
</script>

<style lang="scss">
	.selectok{ border-bottom: #007AFF solid 2px;}
	.echo-top {
		position: relative;
	}

	.echo-topbg {
		width: 750rpx;
		position: absolute;
		top: 0rpx;
		z-index: 0;
	}

	.cu-list.grid {
		background-color: transparent !important;
	}

	.card-swiper {
		height: 300rpx !important;
	}

	/* 通知 */
	.noticbox {
		display: flex;
		align-items: center;

		image {
			display: block;
			margin: 0rpx;
			padding: 0rpx;
			width: 150rpx;
			height: 35rpx;
		}
		.uni-swiper-msg-icon {
			width: 150rpx;
		}
		swiper-item {
			line-height: 80rpx !important; 
		}
		swiper {
			height: 80rpx;
		}
		navigator {
			display: block;
			line-height: 80rpx;
			height: 80rpx;
			font-size: 32rpx;
		}
	}

	/* 热门岗位 */
	.echo-page-title {
		width: 660rpx;
		border-radius: 8rpx 8rpx 0rpx 0rpx;
	}

	.echo-comjobs-list-item {
		padding: 30rpx 15rpx;
		margin: 0rpx 17rpx 20rpx 17rpx;
		border-radius: 8rpx;
	}

	.echo-comjobs-list-item:first-child {
		border-radius: 0rpx 0rpx 8rpx 8rpx;
	}
	
	.join-group {
		display: flex;
		margin-top: 20px;
		box-sizing: border-box;
		width:100%;
		padding:0 60rpx;
	}
	.join-group .join-right {
		margin-left: 40rpx;
		width: 450rpx;
	}
	.join-group .arrow{position: relative;}
	.join-group .arrow:before {
	    position: absolute;
	    top: 0;
	    right: -20rpx;
	    bottom: 0;
	    display: block;
	    margin: auto;
	    width: 30rpx;
	    height: 30rpx;
	    color: var(--grey);
	    content: "\e6a3";
	    text-align: center;
	    font-size: 34rpx;
	    font-family: "cuIcon";
	    line-height: 30rpx;
	    margin-top: auto;
	    margin-right: auto;
	    margin-bottom: auto;
	    margin-left: auto;
	}
	.lw-nav-broker {
		width:710rpx;
		padding:20rpx 0 10rpx 0;
		margin:0 auto;
		display: flex;
		justify-content: space-around;
	}
	.lw-nav-broker .img{
		width: 710rpx;
		height: 160rpx;
	}
	.lw-nav {
		width:710rpx;
		padding:10rpx 0 20rpx 0;
		margin:0 auto;
		display: flex;
		justify-content: space-around;
	}
	.lw-nav .img {
		width: 160rpx;
		height: 160rpx;
	}
</style>