aishangjia-uniapp/pages/zone/zone.vue

<template>
	<view class="container">
		<view class="category" @click="$push('pages/zone/member/member',{name: '有车有房',desc: '0.9w人'})">
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/0036e686027d4994ab03de5cbd0caf34.png" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/03a95e32bc094c09bf56c3ac3ff78f0d.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/b37e315c128241f69d3a7fa5a54fea23.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/26f0ed191b174478b10a510991d18262.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/60b27769b8bb4a0d822a6219ed8767bc.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/03a95e32bc094c09bf56c3ac3ff78f0d.jpeg" mode="widthFix"></image>
			</view>
		</view>
		
		<view class="category" @click="$push('pages/zone/member/member',{name: '精选人类90后',desc: '1w+人'})">
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/0036e686027d4994ab03de5cbd0caf34.png" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/03a95e32bc094c09bf56c3ac3ff78f0d.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/b37e315c128241f69d3a7fa5a54fea23.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/26f0ed191b174478b10a510991d18262.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/60b27769b8bb4a0d822a6219ed8767bc.jpeg" mode="widthFix"></image>
			</view>
			<view class="item">
				<image src="https://file.wsdns.cn/thumbnail/20230604/03a95e32bc094c09bf56c3ac3ff78f0d.jpeg" mode="widthFix"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import store from '@/store/index.js'
	import * as DictApi from '@/api/dict.js'
	import * as UserProfileApi from '@/api/love-user-profile.js'
	
	import mixin from '@/core/mixins/tabbar'
	export default {
		mixins: [mixin],
		data() {
			return {
				list: [
					{
						name: '有房有车'
					},
					{
						name: '人类精选90后'
					}
				],
				user: {},
				avatar: '/static/logo.png',
				nickName: 'Hello',
				latitude: 22.766777,
				longitude: 108.375152,
				scale: 10,
				isLogin: false,
				// #ifdef MP-ALIPAY
				canIUseAuthButton: my.canIUse('button.open-type.getAuthorize'),
				// #endif
			}
		},
		onLoad() {
			this.getLocation(res => {
				if (res.latitude && res.longitude) {
					app.latitude = res.latitude
					app.longitude = res.longitude
					app.scale = 16
				}
			})
			this.getDict()
		},
		onShow() {
			// this.getUserInfo()
		},
		methods: {
			getDict() {
				DictApi.getDictionaryOptions({dictCode: 'zone'}).then(res => {
					this.dict = res.data;
					
				})
			},
			getUserInfo() {
				const {
					form
				} = this
				const app = this
				getUser().then(res => {
					console.log(res);
					if (res.code == 0 && res.data) {
						app.isLogin = true
					} else {
						app.$error('请先登录', function() {
							app.$navTo('pages/login/index');
						});
						return false;
					}
				})

			},
			// 检查是否登录
			checkLogin() {
				if (!!store.getters.userId && store.getters.userId != userId) {
					this.isLogin = true
				}
			},
			// 获取用户坐标
			// 参考文档：https://uniapp.dcloud.io/api/location/location?id=getlocation
			getLocation(callback) {
				const app = this
				uni.getLocation({
					success: callback,
					fail() {
						app.$toast('获取定位失败，请点击右下角按钮重新尝试定位')
						app.isAuthor = false
					}
				})
			},
			// 跳转页面
			navTo(url) {
				this.$navTo(url)
			},
			scan() {
				const app = this
				this.$navTo('pages/order/get-food/get-food')
				// 只允许从相机扫码
				// uni.scanCode({
				//   success (res) {
				// 	console.log("res: ",res);
				//   }
				// })

			}
		}
	}
</script>

<style lang="scss" scoped>
	.category{
		width: 681rpx;
		margin: 30rpx auto;
		background-color: #ffffff;
		border-radius: 12rpx;
		overflow: hidden;
		display: flex;
		flex-wrap: wrap;
		.item{
			width: 220rpx;
			height: 240rpx;
			overflow: hidden;
			image{
				width: 100%;
			}
		}
	}
	
</style>