universal-wechat-uniapp-241007/components/base/pickerHospital.vue

<template>
	<uv-popup 
	ref="popup" 
	:round="30">
		<view class="content">
			<uv-search
			placeholder="请输入搜索内容" 
			@search="getData"
			@custom="getData"
			@clear="getData"
			height="70rpx"
			v-model="queryParams[searchKey]"></uv-search>
			
			<scroll-view 
			scroll-y="true" 
			:style="{height: '50vh'}"
			@scrolltolower="loadMoreData">
				<view class="list">
					<view class="item"
					:key="index"
					@click="select(item)"
					v-for="(item, index) in list">
						<view class="title">
							{{ item[keyName] }}
						</view>
						<view class="desc"
						v-if="descKeyName">
							{{ item[descKeyName] }}
						</view>
					</view>
				</view>
			</scroll-view>
			
		</view>
	</uv-popup>
</template>

<script>
	import mixinsList from '@/mixins/list.js'
	export default {
		mixins: [mixinsList],
		props: {
			keyName : {//展示信息的字段
				default : 'name',
			},
			descKeyName : {
				default : ''
			},
			placeholder : {//搜索框提示词
				default : '请输入搜索内容'
			},
			isPage : {//是否分页
				default : true,
			},
			searchKey : {//搜索参数字段
				default : 'name'
			},
			mixinsListApi : {
				default : '',
			},
		},
		data() {
			return {
				
			}
		},
		watch: {
		},
		methods: {
			open(){
				this.$refs.popup.open('bottom')
				this.getData()
			},
			close(){
				this.$refs.popup.close()
			},
			select(item){
				this.$emit('select', item)
			},
		},
	}
</script>

<style lang="scss" scoped>
	.content{
		padding: 20rpx;
		.list{
			.item{
				padding: 30rpx;
				border: 1rpx solid #00000009;
				.title{
					font-size: 28rpx;
				}
				.desc{
					margin-top: 10rpx;
					color: #888;
					font-size: 24rpx;
				}
			}
		}
	}
</style>