xinelu-applet-ui/pagesC/selectInstitution/selectInstitution.vue

<template>
	<view class="app">
		<view class="top">
			<u-dropdown active-color='#26A888'>
				<u-dropdown-item v-model="address" :title="addressname" :options="addressoptions"
					@change='dropitemchange'></u-dropdown-item>
			</u-dropdown>
			<view class="inputs">
				<i class="icon"></i>
				<input type="text" name="" id="" class="input" placeholder="搜签约机构" v-model="query.orgName">
			</view>
		</view>
		<view class="text">
			请选择您想要签约的机构：
		</view>
		<view class="list">
			<view class="item" v-for="item in institutionlist" @tap='emitdata(item)'>
				<view class="title">
					{{item.orgName?item.orgName:''}}
				</view>
				<view class="address">
					{{item.address?item.address:''}}
				</view>
				<view class="distance" v-if="item.distance">
					<image src="@/static/address.png" mode=""></image>
					<view class="">
						{{item.distance}} KM
					</view>
				</view>
				<view class="Selected" v-if='item.orgNo == orgNo'>
					已选择
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getCounty,
		getNearbyOrg
	} from '@/api/pagesC/selectInstitution/index.js'
	export default {
		data() {
			return {
				orgNo: '',
				address: 1,
				addressname: '全部',
				addressoptions: [{
					label: '全部',
					value: '',
				}, ],
				query: {
					lat: '',
					lng: '',
					pageSize: 10,
					pageNum: 1,
					orgName: '',
				},
				institutionlist: [],
				institutiontotal: 0,
			};
		},
		watch: {
			'query.orgName': {
				handler(newval, oldval) {
					this.query.pageNum = 1
					this.getNearbyOrginfo();
				}
			}
		},
		methods: {
			dropitemchange(e) {
				this.addressname = this.addressoptions.find(m => m.value === e).label
				this.query.countyNo = e
				this.getNearbyOrginfo()
			},
			getCountyinfo() {
				var obj = {
					pageSize: 10,
					pageNum: 1
				}
				getCounty(obj).then(respp => {
					respp.data = respp.data.forEach(e => {
						e.label = e.orgName
						e.value = e.orgNo
						this.addressoptions.push(e)
					})
				})
			},
			getNearbyOrginfo() {
				getNearbyOrg(this.query).then(respp => {
					this.institutionlist = respp.rows
					this.institutiontotal = respp.total
				})
			},
			emitdata(item) {
				uni.$emit('data', {
					data: JSON.stringify(item),
				})
				uni.navigateBack({
					delta: 1
				});
			},
		},
		onLoad(options) {
			options.orgNo ? this.orgNo = options.orgNo : ''
			this.getCountyinfo()
			var that = this
			uni.getLocation({
				type: 'wgs84',
				success: function(resp) {
					that.query.lat = resp.latitude
					that.query.lng = resp.longitude
					that.getNearbyOrginfo()
				},
				fail: function(err) {
					// uni.openSetting({
					// 	success(res) {
					// 		if (res.authSetting['scope.userLocation']) {
					// 			uni.getLocation({
					// 				type: 'wgs84',
					// 				success: function(resp) {
					// 					that.query.lat = resp.latitude
					// 					that.query.lng = resp.longitude
					// 					that.getNearbyOrginfo()
					// 				},
					// 			});
					// 		}
					// 	}
					// });
				},
			});
		},
		onReachBottom() { //上滑加载
			if (this.institutionlist.length >= this.institutiontotal) {} else {
				this.query.pageNum++;
				getNearbyOrg(this.query).then(respp => {
					respp.rows.forEach(e => {
						this.institutionlist.push(e)
					})
				})
			}
		},
		onPullDownRefresh() { //下拉刷新
			this.query.pageNum = 1;
			this.getNearbyOrginfo()
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
	}
</script>

<style lang="scss">
	@import './selectInstitution.scss';
</style>